在 Hexo 中插入数学公式

在有些时候，我需要在文章中插入数学公式（例如变量等），这时候会想到使用 $\LaTeX$ 公式。但是 Hexo 和我当前的主题默认没有支持 $\LaTeX$ 公式渲染，因此本文通过增加 Hexo 主题脚本片段的方式实现 $\LaTeX$ 语法高亮。

主题使用 Mathjax

你可以从主题文件的 README.md 确认你的 Hexo 主题是否已经引入了 Mathjax，如果已经引入，那你只要按照说明来开启 Mathjax 支持即可。如果你的主题并不支持 Mathjax，那你可以按照以下步骤使你的 Hexo 支持 Mathjax。

1. 你需要在 themes/YourThemeName/layout/ 下新建文件 mathjax.ejs 文件。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18

<% if (theme.mathjax.enable){ %>
<script type="text/x-mathjax-config">
  MathJax.Hub.Config({
    tex2jax: {
      inlineMath: [ ['$','$'], ["\\(","\\)"] ],
      processEscapes: true,
      skipTags: ['script', 'noscript', 'style', 'textarea', 'pre', 'code']
    }
  });
  MathJax.Hub.Queue(function() {
    var all = MathJax.Hub.getAllJax(), i;
    for(i=0; i < all.length; i += 1) {
        all[i].SourceElement().parentNode.className += ' has-jax';
    }
  });
</script>
<script type="text/javascript" src="<%- theme.mathjax.cdn %>"></script>
<% } %>

2. 你需要在 themes/YourThemeName/_config.yml 末尾追加：

1
2
3
4

# MathJax Support
mathjax:
  enable: true
  cdn: https://lf26-cdn-tos.bytecdntp.com/cdn/expire-1-M/mathjax/2.7.9/MathJax.js?config=TeX-AMS-MML_HTMLorMML

为了保障国内网络环境的访问，将原文的CDN修改为字节跳动静态资源公共库。

3. 修改 themes/YourThemeName/layout/post.ejs 文件，在中间添加：

1
2
3

<% if (theme.mathjax){ %>
  <%- partial('mathjax') %>
<% } %>

至此，大功告成～
你最后只需要重新生成一下文章就可以看到你的文章现在已经支持 $\LaTeX$ 公式了。

测试

测试一下你的文章是否已经支持 $\LaTeX$ 公式：

1

$$ J_\alpha(x) = \sum_{m=0}^\infty \frac{(-1)^m}{m! \Gamma (m + \alpha + 1)} {\left({ \frac{x}{2} }\right)}^{2m + \alpha} $$

如果你的文章已经支持那么上面的 $\LaTeX$ 语法将会有如下显示：

$$ J_\alpha(x) = \sum_{m=0}^\infty \frac{(-1)^m}{m! \Gamma (m + \alpha + 1)} {\left({ \frac{x}{2} }\right)}^{2m + \alpha} $$

参考文章

https://blog.xiangfa.org/2020/09/let-hexo-support-latex-formulas/