我正在使用棱镜来显示我的文档。所以我去展示了一些漂亮的代码。安装 prism 有两种方法:手动安装或使用 Node 安装。 我使用node来安装它。但要使用它的插件,没有文档解释如何使用: 唯一可用的示例是:
var code = "var data = 1;";
var html = Prism.highlight(code, Prism.languages.javascript);
然后显示 html... 就我而言,我想使用行号。怎么做?
最佳答案
在您的 html 中创建以下内容:
<pre class="line-numbers"><code id="formattedBlock" class="language-javascript"></code></pre>
不要忘记在 header 中导入相关的 CSS 文件
<link rel="stylesheet" href="themes/prism.css" />
<link rel="stylesheet" href="themes/plugins/prism-line-numbers.css" />
确保您需要必要的库
var Prism = require('prismjs/components/prism-core.min');
require('prismjs/components/prism-javascript.min');
require('prismjs/plugins/line-numbers/prism-line-numbers.min');
在你写的例子之后是正确的:
var code = "var data = 1;";
var html = Prism.highlight(code, Prism.languages.javascript);
只需将 html 结果附加到 formattedBlock 元素中即可,例如使用 jQuery:
$('#formattedBlock').append(html);
关于javascript - 如何使用随 Node 安装的 Prism 插件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37393881/