如果你使用 Hexo 构建博客,你可能需要让你的代码块更好地突出显示。这就是 npm 包 Hexo-Prism-Plus 的作用。本篇文章将会详细地介绍如何使用它来优化你的博客。
安装
首先,进入博客根目录,运行以下命令安装 Hexo-Prism-Plus:
npm install hexo-prism-plus --save
然后,在博客的 _config.yml
文件中添加以下内容:
highlight: enable: false line_number: false auto_detect: false tab_replace: prism_plugin: mode: 'preprocess' theme: 'twilight'
其中,prism_plugin.mode
需要设置为 preprocess
,这是为了避免其他插件(如 hexo-abbrlink
等)对代码块的干扰。
最后,进入博客根目录,运行以下命令:
hexo clean hexo g
现在,Hexo-Prism-Plus 就已经安装好了。
使用
Hexo-Prism-Plus 默认支持以下语言:
- markup (HTML, XML, SVG, MathML) -CSS
- C-like (C, C++, C#, Java, JavaScript, Objective-C, PHP, TypeScript)
- Python
- Ruby
- Shell script (Bash, etc.)
- Unix-like config files (INI, JSON, YAML, etc.)
- SQL
- Swift
如果你的代码使用的是其他语言,你可以在 markdown 文件中指定语言类型。例如:
```python def hello(name): print(f'Hello, {name}!')
-- -------------------- ---- ------- --------------- ------------- ------------------ ----------------------- ------------- ---- -------------- --------------- -- ---- ------- --------------- ----- ------ ------ --------- --- ------------- --------- --- --------- -------- -- -- ----- -- - - -- - ----- - - -- -------- -- - - -- - - -
总结
Hexo-Prism-Plus 是一个非常实用的插件,可以让你的博客中的代码块更好地突出显示。本篇文章详细介绍了如何安装和使用它,希望对你有所帮助。
来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/60066b5551ab1864dac66aaf