如何在 Hugo 中正确的使用 Latex

2025.7.1 更新： 实际中下面提到的方法在某些情况下还是会出现问题，要么就是本地无法渲染，要么就是网页无法渲染。不得不说这些静态博客对于 latex 的支持都是依托答辩。 有一个更加通用的方式就是使用 shortcode，比如 LoveIt 主题提供的 raw shortcode，可以避免其包裹的部分被 Hugo 转义。使用这种 shortcode 包裹行间公式，虽然会在本地渲染时存在一些 {{}} 字符，但是可以保证网页渲染正确。 对于行内公式我仍然建议使用 span 元素，毕竟行内出现多余的字符还是很难受的。

---

在之前的文章中我们曾经实现了 Hugo 渲染 Latex 公式，但是在实际的使用中，我们会发现某些公式总是会出现渲染错误。例如使用 $ 包含的行内公式无法被渲染；行间公式无法正确的换行；某些介于公式之间的文本被错误的渲染为了斜体等各种情况。

实际上这一切错误的都是源自 Hugo 对 md 文件的错误转译，即在将 md 格式转为 html 格式的过程中，Latex 公式中的反斜杠 \ 和下划线 _ 等符号被错误的识别为了转义字符和斜体标记。这个错误似乎难以从根本上解决，也有很多人提出了各种各样的方法来试图避免。例如通过特殊的写法或者修改转译过程以避免 Latex 公式被错误处理，但是这些方法其实现方法过于复杂且不够优雅。例如我非常喜欢使用 Typora 来编写 md 文档，如果我们使用特殊的写法来编辑 Latex 公式，那么 Typora 就无法正确的渲染这些公式，因此在编辑阶段我就只能看到一堆杂乱的符号。

实际上我们可以做一些妥协，既不需要对转译过程进行复杂的修改，也可以保留 Latex 的正确语法从而保证 Typora 可以正确渲染。

即对于可能引起转译错误的 Latex 公式使用 “ 和<div></div> 包裹。行内公式使用前者，行间公式则使用后者。那么哪些公式可能引起错误转译呢？经验而言是包含了下划线和反斜杠的内容，当然也可以选择对所有 Latex 公式都进行包裹。