Hexo + Next 如何展示数学公式

计算机科学中，免不了会遇到需要编辑数学公式的情况，比如作者在写《Mysql学习笔记：索引之B-Tree、B+Tree》时就针对回盘次数做了公式说明。那么 Hexo + Next 中如何能够正确的渲染数学公式？

开始说解决方案前需要做以下信息的同步：

1. 文章的编辑是以 Markdown 进行的；

2. 文章的编辑是使用TeX作为它的格式化引擎，无论你使用的是 LaTeX 还是 KaTeX 作为你的排版系统；

3. 你已经读过《Hexo Next 数学公式》还没有找到解决方案；

4. 你已经开启了 theme-next/_config.yml 的 mathjax 功能。

   math:
     # Default (true) will load mathjax / katex script on demand.
     # That is it only render those page which has `mathjax: true` in Front-matter.
     # If you set it to false, it will load mathjax / katex srcipt EVERY PAGE.
     per_page: true
   
     # hexo-renderer-pandoc (or hexo-renderer-kramed) required for full MathJax support.
     mathjax:
       enable: true # 已经开启功能

走过的弯路

首先，作者在选择插件上走过了一些弯路。上述第 3 点推荐 hexo-renderer-pandoc 但是不推荐 hexo-renderer-kramed。但是在本人实践后更推荐 hexo-renderer-kramed，因为它是开箱即用的，而 pandoc 还需要安装相关的二进制（brew info/search/install pandoc)。

其次，作者在纠结是公式格式错误还是插件错误中徘徊了很久。现象是作者在编写完公式并且重新渲染后，原本应该展示信息的位置内容为空了。此时有以下几点可能：

• 打开浏览器的开发者模式，确定下是否内容已经放在了<script type="math/tex"></script>中，如果已经出现了则应该转换思路到是相关 js 解释器未被加载；
• 这个过程也可能你编写的内容被完整以字符串的形式展示出来了，这说明你的排版语言未正确。比如说 $ 未对应或者你的 kramed 版本已经强制要求使用新的语法规则了。

针对第一种可能，你可能已经发现在页面的内容中未找到 mathjax 相关的 js 文件。作者在配置中找了多次相关配置（cdn配置和功能开启2处）均无法解决。后来经过大量查询，终于在一篇文章中找到相关解决方案。那就在需要在每篇文章中开启相关功能。

...
title: ...
mathjax: true # 文章头中增加此配置开启 js 能力
...

---

展示几个数学公式：

1. \[ e=mc^2 \]

源码为：

$$e=mc^2$$

2. \[\begin{equation} \begin{aligned} a &= b + c \\ &= d + e + f + g \\ &= h + i \end{aligned} \end{equation}\]

源码为：

$$\begin{equation}\label{eq2}
\begin{aligned}
a &= b + c \\
  &= d + e + f + g \\
  &= h + i
\end{aligned}
\end{equation}$$

参考

• 《Hexo Theme Next 数学公式》

• 《Hexo基本操作》