默认情况下,VuePress似乎只支持少数几种语言来进行语法突出显示(默认主题也是如此)。
文档中经常提到"Line highlight“,但这是一个完全不同的功能,用于突出显示代码片段中的特定行。我正在寻找的能力,有语法突出显示的方案片段,或Java或PHP或其他。
开箱即用,我只看到对JS,TypeScript,HTML,Markdown,JSON,Ruby,Python,Shell的支持。
发布于 2018-08-28 11:15:29
要使vuepress的语法高亮显示适用于其中一种默认不进行高亮显示的语言,您需要为该语言添加CSS规则。
在.vuepress/style.styl
中,为方案支持添加以下规则:
div[class~=language-scheme]:before {
content:"scheme"
}
或者执行以下命令以支持docker文件:
div[class~=language-docker]:before {
content:"docker"
}
发布于 2018-08-28 07:01:07
开箱即用的主题由两部分组成: VuePress本身和它的默认主题。
VuePress本身通过使用prismjs来处理“语法”部分。prismjs转换下面的markdown
```SQL
选择column1
来自table_name;
放入下面的html中
<code>
<span class="token keyword">SELECT</span>
column1
<span class="token keyword">FROM</span>
table_name
<span class="token punctuation">;</span>
</code>
你可以在here上找到prismjs支持的语言。
我不知道之前的情况,但至少VuePress v0.14.2支持prismjs支持的所有语言。
默认的主题处理程序通过导入prismjs's css来高亮显示这些令牌类。
https://stackoverflow.com/questions/51881493
复制相似问题