首先测试下当前Hexo对Math的支持情况:
$$ \begin{eqnarray} \nabla\cdot\vec{E} &=& \frac{\rho}{\epsilon_0} \ \nabla\cdot\vec{B} &=& 0 \ \nabla\times\vec{E} &=& -\frac{\partial B}{\partial t} \ \nabla\times\vec{B} &=& \mu_0\left(\vec{J}+\epsilon_0\frac{\partial E}{\partial t} \right) \end{eqnarray} $$
安装MathJax渲染程序
$ npm install hexo-renderer-mathjax --save
修改文件_config.yml
,添加内容(貌似不加也行):
plugins:
- hexo-renderer-mathjax
CDN出错
原来的CDN已不再使用,所以需要修改文件\node_modules\hexo-renderer-mathjax\mathjax.html
这部分的注入代码。新的通过连接CDN加载MathJax的js代码为:1
2
3<script type="text/javascript" async
src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.1/MathJax.js?config=TeX-MML-AM_CHTML">
</script>
MarkDown与MathJax渲染冲突
添加MathJax后写几个公式发现渲染出了很多问题,原因是Hexo默认先使用hexo-renderer-marked引擎渲染MarkDown,然后再交给MathJax渲染。hexo-renderer-marked会把一些特殊的markdown符号转换为相应的html标签,比如在markdown语法中,下划线_
代表斜体,会被转化为< em>标签,\\
也会被转义成一个\
。而类Latex格式书写的数学公式下划线_
表示角标,\\
表示公式换行,有特殊的含义,所以MathJax引擎在渲染数学公式的时候就会出错。
解决方法有人提出更换Hexo的MarkDown渲染引擎,用hexo-renderer-kramed 替换默认的hexo-renderer-marked引擎,但我看了下hexo-renderer-kramed的文档说明,如果用这个引擎的话,要改变我的MarkDown书写习惯,还是不用了,并且换了这个引擎还是没有完全解决问题。
最终解决方法是参考一篇博文中修改hexo-renderer-marked渲染引擎的js脚本,去掉对 _
和 \\
的转义。Hexo默认的MarkDown渲染引擎hexo-renderer-marked会调用marked模块的marked.js脚本进行最终的解释,这个脚本在Hexo安装后的node_modules\marked\lib\目录中。有两点修改:
针对下划线的问题,取消_
作为斜体转义,因为marked.js中*
也是斜体的意思,所以取消掉_
的转义并不影响使用markdown,我平时一般不用斜体,就是用也更习惯用*
作为斜体标记。针对marked.js与Mathjax对于个别字符二次转义的问题,我们只要不让marked.js去转义\\,\{,\}
在MathJax中有特殊用途的字符就行了。编辑node_modules\marked\lib\marked.js 脚本,
【第一步】
将451行的1
escape: /^\\([\\`*{}\[\]()# +\-.!_>])/,
替换为1
escape: /^\\([`*\[\]()# +\-.!_>])/,
这一步取消了对\\,\{,\}
的转义(escape)
【第二步】
将459行的1
em: /^\b_((?:[^_]|__)+?)_\b|^\*((?:\*\*|[\s\S])+?)\*(?!\*)/,
替换为1
em:/^\*((?:\*\*|[\s\S])+?)\*(?!\*)/,
这一步取消了对斜体标记_
的转义
这样带来一个问题就是,以后每次更换电脑,在新电脑上安装完Hexo环境后,都要手动修改marked.js
文件。