hexo渲染Latex公式（最简单方法）_仅参考

咩之歌_夜猫与百灵

已于 2023-10-14 21:51:26 修改

阅读量2.8k

点赞数 2

分类专栏： hexo 文章标签：学习经验分享 github

于 2023-02-10 16:00:42 首次发布

本文链接：https://blog.csdn.net/u014155600/article/details/128972156

版权

hexo 专栏收录该内容

7 篇文章

订阅专栏

本文介绍了如何在Hexo博客中使用最简单的方法渲染LaTeX公式，无需更换渲染器。主要涉及hexo-renderer-marked的问题、解决方法，以及MathJax和Katex的配置与使用，包括内联公式和居中显示的格式。文章还提到了Markdown写作时的注意事项，以避免冲突。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

写在最前

PS:该片文章主体写于2023-2-10，请谨慎识别文章的时效性

2023-2-10:使用hexo-renderer-markdown-it-plus可以支持用$$写入并且近乎完全支持，在脚注方面不会像marked一样失效。hexo-math方案仅用作参考，如果需要更好的体验还是建议换一个渲染器。

hexo渲染Latex公式（最简单方法）

hexo渲染器对比优缺点看这里：https://zsyyblog.com/b73ceb85.html

前言

这是我用的npm list

├── hexo-deployer-git@3.0.0
├── hexo-generator-archive@2.0.0
├── hexo-generator-category@2.0.0
├── hexo-generator-index@3.0.0
├── hexo-generator-tag@2.0.0
├── hexo-math@4.0.0
├── hexo-renderer-ejs@2.0.0
├── hexo-renderer-marked@6.0.0
├── hexo-renderer-pug@3.0.0
├── hexo-renderer-stylus@2.1.0
├── hexo-server@3.0.0
├── hexo-theme-landscape@0.0.3
└── hexo@6.3.0

使用的主题为butterfly

本篇不采用pandoc，markdown-it-plus等渲染器，只用默认支持的marked和hexo-math来进行渲染公式的工作。

hexo-renderer-marked渲染公式为什么有问题

hexo本身默认使用marked.js去解析我们写的markdown，比如一些符号，_代表斜体，会被处理为<em>标签，
比如x_i在开始被渲染的时候，处理为x<em>i</em>，这个时候mathjax就无法渲染成下标了。
很多符号都有这个问题，比如粗体*,也是无法在mathjax渲染出来的，好在有替代的乘法等,包括\\同理。

很多网上的教程都推荐换渲染器之后进行md文档的书写，但是hexo-math迭代到4.0已经有相对较好的解决方案，而且在公式上只需完整复制公式语法(测试不完全，存疑)即可实现公式渲染。

前置工作

安装hexo math

$ npm i hexo-math --save

需要Hexo 5 版本或以上，我的是6.0.0，可以采用此方法

之后，在本地博客的_config.yml添加如下配置：

math:
  katex:
    css: 'https://cdn.jsdelivr.net/npm/katex@0.12.0/dist/katex.min.css'
    options:
      throwOnError: false
  mathjax:
    css: 'https://cdn.jsdelivr.net/npm/hexo-math@4.0.0/dist/style.css'
    options:
      conversion:
        display: false
      tex:
      svg:

如果不用katex部分可以尝试去除，保留自己需要的部分。

使用这种方式时，文章是默认开启公式渲染的，如果需要禁用则在文章开头写如下配置：

---
mathjax: false
---

katex同理。

完成以上步骤即可在md文档中进行公式渲染了。

可选步骤：找到themes\yourtheme\_config.yml中，找到关于mathjax部分，更改为以下配置：

mathjax:
  enable: true
  per_page: false

可以选择改或不改，我把enable的值保持为默认false时并未发现报错。

conversion为什么将多出一个参数display:false：按照官方文档，这个参数本应该为true，参数的含义为指定是否显示数学公式的boolean值（对于TeX输入），可能因为避免引起bug将其改为false（但是删除好像也不会引起bug）。

使用方式

例子：

这是{% mathjax %}
\frac{1}{x^2-1}
{% endmathjax %}例子

在网页展示为：

在这里插入图片描述

可以发现，这种方法只能用内联方式写入，如果要实现居中显示等效果，hexo-math也给出了方案，即采用以下格式：

{% mathjax '{options}' %}
content
{% endmathjax %}

这种方法可以重写特定内容的配置和全局选项。选项必须以JSON格式指定。

例子：

{% mathjax '{ "conversion": { "em": 14 }, "tex": { "tags": "ams" }, "svg": { "exFactor": 0.03 } }' %}
\frac{1}{x^2-1}
{% endmathjax %}

显示为：

在这里插入图片描述

可以看出这两种的差别，如果想更多了解关于选项方面的内容，可以阅读hexo-math的readme.md文档。

覆盖文章全局选项

hexo-math给出一种方法可以在该篇文章内选择覆盖文章的渲染设置，即在开头配置写入：

---
mathjax:
  conversion:
    em: 14
  tex:
    tags: 'ams'
  svg:
    exFactor: 0.03
---

katex部分可以参照官方文档。

方法优缺点

优点：

更改内容较少即可使用；
无需将$$转义等步骤，避免出现更多的bug
对默认渲染器marked友好
公式方面照抄就可以实现

缺点：

使用默认的渲染器，功能较少，较难扩展功能
需要使用{% %}方式，编写文档时不能及时渲染
想要使用舒服需要自己学习使用option选项和调试参数，有一定的学习成本

题外话

用hexo 进行md文档的书写时会有一个问题

首先是当识别到类似于使用{{}}或{％％}包装的内容将被解析，并可能导致问题。这点需要注意。