Question

我使用棱镜来显示我的文档。所以我去展示一些漂亮的代码。要安装棱镜，有两种方法：手动安装或使用节点。我用node来安装它。但是要使用它的插件，没有文档解释如何：唯一可用的例子是：

var code = "var data = 1;";
var html = Prism.highlight(code, Prism.languages.javascript);

然后显示html ... 在我的情况下，我想使用行号。怎么样？

Answer 1

在你的html中创建以下内容：

<pre class="line-numbers"><code id="formattedBlock" class="language-javascript"></code></pre>

不要忘记在标题

中导入相关的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);

如何使用与节点一起安装的Prism插件

1 个答案: