Hexo教程3：渲染MathJax数学公式

第一次开始写公式，发现网页中并没有渲染出来。参考大神的博客，终于搞定了。
参考博客 https://www.jianshu.com/p/7ab21c7f0674

渲染MathJax数学公式

Hexo默认使用hexo-renderer-marked引擎渲染网页，该引擎会把一些特殊的markdown符号转换为相应的html标签，比如在markdown语法中，下划线 _ 代表斜体，会被渲染引擎处理为<em>标签。
因为类Latex格式书写的数学公式下划线 _ 表示下标，有特殊的含义，如果被强制转换为<em>标签，那么MathJax引擎在渲染数学公式的时候就会出错。例如， $x_i$ 在开始被渲染的时候，处理为 $x<em>i</em>$ ，这样MathJax引擎就认为该公式有语法错误，因为不会渲染。

类似的语义冲突的符号还包括*, {, }, \等。
解决方法为更换hexo的Markdown渲染引擎。hexo-renderer-kramed引擎是在默认的渲染引擎hexo-renderer-marked的基础上修改了一些bug，两者比较接近，也比较轻量级。

先卸载原来的渲染引擎，再安装新的。

npm uninstall hexo-renderer-marked --save
npm install hexo-renderer-kramed --save

此时行内公式的渲染还是有问题，因为hexo-renderer-kramed引擎也有语义冲突的问题。
接下来到博客根目录下，找到node_modules\kramed\lib\rules\inline.js，把第11行的escape变量的值做相应的修改。这一步是在原基础上取消了对\,{,}的转义(escape)。同时把第20行的em变量也要做相应的修改。
```
//  escape: /^\\([\\`*{}\[\]()#$+\-.!_>])/,
escape: /^\\([`*\[\]()#$+\-.!_>])/
```

   //  em: /^\b_((?:__|[\s\S])+?)_\b|^\*((?:\*\*|[\s\S])+?)\*(?!\*)/,
   em: /^\*((?:\*\*|[\s\S])+?)\*(?!\*)/

在主题中开启mathjax开关。进入到主题目录，找到_config.yml配置问题，把mathjax默认的false修改为true，具体如下：
```
 # MathJax Support
 mathjax:
   enable: true
   per_page: true
```
在文章的Front-matter里打开mathjax开关。之所以要在文章头里设置开关，是因为考虑只有在用到公式的页面才加载 Mathjax，这样不需要渲染数学公式的页面的访问速度就不会受到影响了。如下：
```
 ---
 title: index.html
 date: 2016-12-28 21:01:30
 tags:
 mathjax: true
 --
```
重新启动hexo（先clean再generate）,问题完美解决。