hexo博客MathJax公式渲染问题
这个问题自己很早以前便碰到了，用MathJax语法写的一些公式，在本地Markdown编译器上渲染是没问题的，可是部署到hexo博客中就出现问题了，之前我是使用图片代替公式应付过去了，今天从网上找了一下资料，发现了其问题所在，同时也解决了这个问题。
问题
hexo默认使用hexo-renderer-marked引擎去渲染网页，它会把利用Markdown语法写的文本去转换为相应的html标签。在利用Markdown写MathJax公式的时候，经常会用到下划线_表示下标，但是下划线_会被hexo的默认引擎hexo-renderer-marked渲染成html中的<em>标签，表示斜体，这样一来，我们写的MathJax公式就被错误渲染了，也就没办法正确显示出来。
例如：
在我写的KMP算法这篇文章中，没有解决问题之前，出现着各种渲染错误，而当你仔细观察那些错误之处时，会发现你写的MathJax公式中的下划线_会莫名其妙地消失。
下图是我利用Markdown编译器写的文本
是表格的一部分，在Markdown编译器预览是正确的，如下图
但是部署到hexo博客后，便出现了错误，呈现的效果如下图
我们发现公式没有渲染成功，仔细观察这个式子特征，发现它和我之前写的相比，少了部分_,打开该网页源代码，定位到这里，如下图
会发现缺少的_其实是被hexo的渲染引擎渲染成了html中的<em>标签，这样一来，这个公式就不完整了，那么也就不能正确显示了。
解决方法
从上面的分析，我们可以知道问题或许出在hexo的渲染引擎上，如果渲染引擎不把公式中的一些特殊字符渲染成html标签，也就避免了这个问题。当然已经有人意识到了这个问题，并且对原先的渲染引擎进行了改进，生成了新的hexo-renderer-kramed引擎，这里是它的Github页面，所以我们只需要卸载默认引擎，并安装这个新的渲染引擎即可。
npm uninstall hexo-renderer-marked --save
npm install hexo-renderer-kramed --save
我之前写有一篇KMP算法，就是在这里发现的渲染出错问题，当我把渲染引擎更换之后，发现大部分公式都正确渲染了，而从网上其他人的叙述中，也同样提到了这个问题，即是行间公式都没有问题，但是个别行内公式还会出现渲染出错，从网上找到了一个方法，解决了这一问题。
定位到你的博客根目录，找到../node_modules/kramed/lib/rules/inline.js文件，
进行部分修改：
//escape: /^\\([\\`*{}\[\]()#$+\-.!_>])/, 第11行，将其修改为
escape: /^\\([`*\[\]()#$+\-.!_>])/,
//em: /^\b_((?:__|[\s\S])+?)_\b|^\*((?:\*\*|[\s\S])+?)\*(?!\*)/, 第20行，将其修改为
em: /^\*((?:\*\*|[\s\S])+?)\*(?!\*)/,
它取消了该渲染引擎对\,{,}的转义，然后再hexo clean、hexo g重新部署，即可解决问题。
另外需要注意一点，对于需要用到MathJax公式的文章，要在Front-matter中打开MathJax开关，例如：
---
date: 2017/8/3 18:20:00
tags: hexo
mathjax: true
title: hexo博客MathJax公式渲染
---
MathJax公式语法
下面呢，我整理总结了一番比较常用的MathJax公式语法，同时也可以用来测试一下渲染效果。
| 符号 | 释义 | 测试用例 | 最终效果 |
|---|---|---|---|
| ^ | 上标 | x{yz}=(1+ex) | $ x{yz}=(1+ex) $ |
| _ | 下标 | CO_2 | $ CO_2 $ |
| \frac{分子}{分母} or 分子 \over 分母 | 分数 | f(x,y,z)=3y2z(3+\frac{7x+5}{1+y2}) | $ f(x,y,z)=3y2z(3+\frac{7x+5}{1+y2}) $ |
| \sqrt[根指数，省略时为2] | 开方 | \sqrt{2}、\sqrt[3] | \(\sqrt{2} 、\sqrt[3]{9}\) |
| \ldots | 与文本底线对齐的省略号 | x_1x_2{\ldots}x_n | \(x_1x_2{\ldots}x_n\) |
| \cdots | 与文本中线对齐的省略号 | x_1x_2{\cdots}x_n | \(x_1x_2{\cdots}x_n\) |
| \int_积分下限^积分上限(被积表达式) | 积分 | \int_1n{x2}dx | $ \int_1n{x2}dx $ |
| \sum_{下标表达式}^{上标表达式} | 累加 | \sum_{i=1}^n \frac{1} | $ \sum_{i=1}^n \frac{1}{i^2} $ |
| \, or ; or \quad or \qquad | 不同宽度的空格 | a , b \mid a ; b \mid a \quad b \mid a \qquad b | $ a , b \mid a ; b \mid a \quad b \mid a \qquad b $ |
| \color{颜色} | 更改文字颜色 | \color{red} | $ \color{red}{红色} $ |
上面的一些基本语法使用了行内公式， 渲染效果没有问题，下面再利用行间公式写一些较为复杂的公式。
分段函数
分段函数格式为f(x)=\begin{cases}语句1\\语句2\\...\end{cases}
\text{文字}中仍可以使用$公式$去插入其他公式，所以可以将其结合分段函数一起使用。
实例：
md文本
$$
f(n)=\begin{cases}
n/2, & \text{如果$ x<=2 $}\\
3n+1, & \text{如果$ x>2 $}
\end{cases}
$$
最终效果
大括号和小括号
()、[]、{}表示的即是符号本身，使用\{\}来表示{}。但是如果要显示大号的括号时，需要使用\left和\right命令。
实例：
- 正常括号
md文本
$$
f([\frac{1+\{x,y\}}{(\frac{x}{y}+\frac{y}{x})(u+1)}+a]^{3\2})
$$
最终效果
- 大括号
md文本
$$
f\left(
\left[
\frac{
1+\left\{x,y\right\}
}{
\left(
\frac{x}{y}+\frac{y}{x}
\right)
\left(u+1\right)
}+a
\right]^{3\2}
\right)
$$
最终效果
添加删除线
使用删除线功能必须使用行间公式，删除线分为片段删除线和整段删除线，样式比较多，在这里我只列举一种比较常用的水平删除线，它属于整段删除线的一种。
整段删除线使用\require{enclose}来显示，声明整段删除线后，使用\enclose{删除线效果}{字符}来实现删除线效果，而水平删除线效果用关键字horizontalstrike。
实例：
md文本
$$
\require{enclose}\begin{array}{}
\enclose{horizontalstrike}{x+y}\\
\enclose{horizontalstrike}{x*y}\\
\end{array}
$$
最终效果
注意事项
我在更换hexo的渲染引擎的时候，还出了一点问题，当我卸载了原先的渲染引擎，安装新的时，出了错误，如下图：
它显示我的npm版本为v4.2.0，我将npm更新到了最新版本，再次安装，便没有问题了。
通过这篇文章和KMP算法，里面也涉及了较多的MathJax公式，从效果上来看，都没有出现什么问题，这也说明了该方法还是有一定的效果的。
