笔者在配置Hexo博客的数学公式的时候，踩了很多坑，现在数学公式显示终于正常，故分享一下我自己的经历，给大家避避雷。

正确的方法

环境配置

首先先放上正确的做法：

配置pandoc和filter-mathjax

hexo默认安装hexo-renderer-marked和hexo-math，请先卸载这两个模块：

1
2
npm uninstall hexo-renderer-marked --save
npm uninstall hexo-math --save

然后安装pandoc和filter-mathjax:

1
2
npm install hexo-renderer-pandoc --save
npm install hexo-filter-mathjax --save

然后我们在本地配置文件_config.yml添加

1
2
3
4
5
6
7
mathjax:
  tags: none # 或 'ams' 或 'all'
  single_dollars: true # 启用单个美元符号作为内联（行内）数学公式定界符
  cjk_width: 0.9 # 相对 CJK 字符宽度
  normal_width: 0.6 # 相对正常（等宽）宽度
  append_css: true # 将 CSS 添加到每个页面
  every_page: false # 如果为 true，那么无论每篇文章的前题中的 `mathjax` 设置如何，每页都将由 mathjax 呈现

如果你的某篇文章需要使用mathjax数学公式，只需要在文章开头的设置处添加

1
2
3
---
mathjax: true
---

即可。

本地运行

本地运行需要在本地安装pandoc。

在pandoc release网站找到安装包，windows用户直接下载msi安装即可，记得配置环境变量，Linux用户直接用dpkg安装即可

安装完成之后记得重新启动，使pandoc环境生效

如果这时hexo generate报错，重装hexo-renderer-pandoc，重启电脑即可解决问题

Github action

如果你和我一样，使用Github action自动部署的话，要注意Github远程主机并不自带pandoc，需要我们手动安装。

在workflows里面的自动部署配置文件中添加：

1
2
3
4
5
- name: Install pandoc
        run: |
          cd /tmp
          wget -c https://github.com/jgm/pandoc/releases/download/2.14.0.3/pandoc-2.14.0.3-1-amd64.deb
          sudo dpkg -i pandoc-2.14.0.3-1-amd64.deb

然后在hexo generate之前加上

1
pandoc --version
即可。

注意事项

pandoc渲染的Markdown语法和原生Markdown语法不尽相同，一定要注意

比如最显著的一点是，内联公式中，$符号和前后的公式之间不能留下空格

这里建议大家使用vscode自带的markdown预览功能，与pandoc渲染的效果是很接近的

个人踩的一些坑

在网上参考了很多文章 发现大家的普遍做法是卸载hexo-renderer-marked和hexo-math，然后安装hexo-renderer-kramed和hexo-renderer-mathjax。

我也照做了 发现这么做虽说可以成功，但是稍微长一点的内联公式下面就会有滚动条，显示十分不舒服

我尝试更改过相应的css，但是更改始终不能在本地成功保存，总是提示权限不够，折腾一晚上后作罢。

目前个人实测，还是以上述方案为最优。