Prismjs 高亮文件答案

【问题标题】：Prismjs highlight filePrismjs 高亮文件
【发布时间】：2025-12-15 10:30:01
【问题描述】：

我正在尝试使用 Prismjs https://prismjs.com/index.html 文件高亮插件 https://prismjs.com/plugins/file-highlight/ 高亮 C++ 文件。所以我尝试了：

<html>
<head>
<title>Welcome to nginx!</title>
<style>
    body {
        width: 35em;
        margin: 0 auto;
        font-family: Tahoma, Verdana, Arial, sans-serif;
    }
</style>
    <link href="themes/prism.css" rel="stylesheet" />
</head>
<body>
    <script src="prism.js"></script>
    <pre data-src="main.cpp"></pre>
    <pre><code class="language-css">p { color: red }</code></pre>
</body>
</html>

但它不起作用。 CSS 部分出现在那里，但main.cpp（与index.html 和prism.js 在同一个文件夹中）没有出现。我得到了：

关于我应该看的任何建议吗？

我不习惯 html/css/js。

【问题讨论】：

标签： javascript html nginx plugins prismjs

【解决方案1】：

正如@Norman Potts 所说，您需要添加文件高亮插件。

我用过： https://prismjs.com/download.html#themes=prism&languages=markup+css+clike+javascript+c+cpp+json&plugins=line-highlight+line-numbers+file-highlight+keep-markup+unescaped-markup

你也只需要这个

<pre data-src="main.cpp"></pre>

不是这个

<pre><code class="language-css">p { color: red }</code></pre>

【讨论】：

【解决方案2】：

您在下载 prism 时没有选择“文件高亮”插件。刚遇到同样的问题。选择它再次下载它，它对我有用。

【讨论】：