4

我正在使用 Docsify 来提供有关我的项目的文档。对于语法突出显示,我想使用 prism.js。可悲的是,突出显示部分不起作用。我也尝试了这里提到的所有建议。

在我的 index.html 中<script src="//unpkg.com/prismjs/components/prism-ruby.js"></script>,正如 docsify 在这里提到的那样。在file.md我想展示一些 Ruby 代码的地方:

<pre><code class="language-ruby">
  def hello(name)
    p "Hello #{name}"
  end
</code></pre>

但是 Ruby 代码没有被突出显示。 在此处输入图像描述

正在呈现的 HTML:

<pre><code class="language-ruby">
  def hello(name)
    p "Hello #{name}"
  end
</code></pre>

我在这里想念什么?

4

2 回答 2

3

尝试手动调用 Prism.highlightAll()

<script defer src="./docsify.min.js"></script>
<script defer src="./prism.js"></script>
<script defer lang="javascript">
   window.$docsify = {
      // call Prism.highlightAll() in vue hook
      plugins: [
         function (hook, vm) {
            hook.doneEach(function (html) {
               Prism.highlightAll()
               console.log('mounted,', Prism, Prism.languages.flow)
            })

         }
      ]
   }
</script>

于 2018-04-13T03:57:46.827 回答
2

经过一些测试后,由于某种原因,docsify 似乎不会要求 Prism 在手动放置标签时突出显示。

如果没有什么可以阻止您使用标准 markdown 语法,您应该更喜欢它:

```ruby
def hello(name)
    p "Hello #{name}"
end
```
于 2020-11-04T14:23:09.953 回答