字词数:2619   ✧   阅读量:   ✧  

以下按钮可供你方便地引用本文。URL 中即使域名变化,其后的路径也将始终指向原本的内容。
https://css.celestialy.top/p/95e11a033
[网页笔记/博客的 LaTeX 支持现状 | clsty 的网络空间站](https://css.celestialy.top/p/95e11a033)
[[https://css.celestialy.top/p/95e11a033][网页笔记/博客的 LaTeX 支持现状 | clsty 的网络空间站]]

有那么一些人想在网页上使用 LaTeX,继而也就出现了一个天大的坑。

前言

众所周知,使用 LaTeX 最正宗的方法就是使用某个 LaTeX 发行版比如 TeXLive,然后写 *.tex 文件,编译之。

常规的引擎与配置,会生成一份 PDF 文件。

而 PDF 文件专精于纸质排版(也包括论文等专业文档的排版),在电子设备上查看时倒不是不行,但对比网页来说总是差了那么亿点意思。1

那么,我们可以在网页上使用 LaTeX 吗?这里引用 2019 年 6 月李阿玲的回答

世界上没有任何一个博客平台支持完整的LaTeX。

怕不是你们把 mathjax 当作 LaTeX 了吧。完整的 LaTeX 支持包括字体/宏包等极端复杂的运行时。虽然你们看 mathjax,觉得像 LaTeX,但事实不是那么回事。mathjax 的本质上在基于 mathml 的,它只是有一个看起来很像 LaTeX 公式语法的前端,在细节上可以说是和 LaTeX 有一些不兼容的。而且 mathjax 没有修改底层数学公式排版参数的能力。

从排版的最后结果上看,其实 LaTeX 现在能做到的在 HTML5 上都能做到,哪怕是在 HTML 里面要搞得很复杂。

但是这没啥意义。语法简单的,有人觉得表现力不强。表现力强的,有人就不愿意学了。

人性从来都是如此。

不过,五年之后,在写此文的 2024 年,情况或许会有些不一样,于是笔者就此方面再次进行了尝试,并整理出了本文。

现状

以下尝试是围绕我的个人需求来进行的,也即利用博客(或类似的)工具搭一个使用网页来浏览的笔记系统2,使之具有较为完备的 LaTeX 支持。

KaTeX 和 Mathjax

这俩不是开箱即用的方案,而是技术底层。

它们都是 LaTeX 语法的部分实现,并非真正的 LaTeX,也不支持 LaTeX 宏包。

比如,不能用 Tikz 来画电路图。将不同字符拼在一起来组成自定义符号的这种操作也更是想都不用想了。

Markdown 笔记

Obsidian、Typora 等以 Markdown 为核心的笔记,据说能够生成网页,但它们同样使用的是 KaTeX、Mathjax 这种伪 LaTeX。

R Markdown

很早之前,我就听说过 R Markdown 是支持 LaTeX 宏包的。所谓 R Markdown,就是将 R 语言与 Markdown 结合的产物。

但当我满怀期待地去尝试后,半天才发现,R Markdown 仅在编译为 PDF 时才使用原生的 LaTeX。

要用 R Markdown 写博客,可以使用 blogdown,而它在生成 HTML 时则靠 Mathjax 对 LaTeX 公式进行最终渲染(参阅 Blogdown 文档)。

Typist

这是 LaTeX 的一个代替品。相对于我的需求,它有以下缺点:

  • 生态相对 LaTeX 差太多(才刚出来不久,缺乏积累)。
  • 似乎有商业化的想法,比如所提供的 App 似乎是闭源的,还要注册才能使用。
  • 目前找不到任何用 Typist 写博客的例子。

Pandoc 与 lua-filter

涛叔的一篇文章中,作者介绍了自研的一套博客系统:用 Pandoc 结合其 lua-filters 扩展实现将 LaTeX 代码预先转换为图片,从而支持真 LaTeX(相关的另两篇文章:1 2)。

但是,此博客没有树形导航侧边栏,也不支持全站搜索,在导航功能上甚至不如 PDF。

tex2svg

注:这也是底层技术,而不是开箱即用的方案。

与 Emacs Org-mode 及涛叔的思路类似,我们可以用 LaTeX 引擎将 LaTeX 代码转换为 SVG 再插入网页。

GitHub 上搜索 tex2svg,大多数项目都是基于 Mathjax 这种伪 LaTeX 的。

但也有少数例外,比如:Ximik/tex2svg

Emacs Org-mode

Emacs Org-mode 倒是支持完整的 LaTeX。

它也有一些痛点,比如 Emacs 本身是单线程,再如它倒是能导出 HTML,但是此 HTML 在默认情况下,并非像博客站那样有导航栏、搜索栏之类的,而只是一个单文件。

但是,Emacs 强就强在它的可扩展性好,下面简述一些基于 Org-mode 的方案。

Weblorg

还没尝试,不知道它的具体原理和特性。虽然在其源码里没找到 MathJax、KaTeX 之类的,但也没找到与 LaTeX 和 SVG 同时相关的,说不定完全不处理 LaTeX,也或许完全是由 Org-mode 自带的功能来处理 LaTeX 的。

ox-hugo

其原理是将 Org-mode 先转为 Hugo 所用的 markdown,再用 Hugo 转为网页。

我们知道,Hugo 对 Markdown 中的 LaTeX 的处理也是交给 Hugo 主题来进行的,而绝大多数的 Hugo 主题则是调用 KaTeX 或 Mathjax,并且我目前没有找到调用真正的 LaTeX 引擎的 Hugo 主题。

但是,ox-hugo 支持一个很特别的功能:它可以将 LaTeX 转换为 svg 或 png 图片并嵌入 Markdown 中。

因此,Emacs+Org-mode+ox-hugo+Hugo,再加上一个适合作为笔记的主题,这就是符合本文要求的一种答案了。

org-publish

此为 Org-mode 内置功能,所以支持完整的 Org-mode,且上限很高。

详见 Eli 的百般武艺,此乃 Emacs (一):用 Emacs 写博客

不过此项目仍在施工中,搜索功能、跨页面的树型导航栏以及使用了 LaTeX 宏包的实际例子仍未出现,未来可期。

MathML

需要说明的是,本方案完全脱离 LaTeX,不过它理应也能提供完整的数学公式支持。

MathML3 即 Mathematical Markup Language,是一种用于描述数学公式、符号的 XML 标记语言。

至于它是否支持网页,答案是: MathML 可以说正是为网页而生的,并且 Mathjax 和 KaTeX 所做的事情实际上也正是将 LaTeX 转换为 MathML。

那么,如何使用 MathML 来写博客呢?此处引用 Ld Beth 所介绍的流程4

用 Emacs 自带的 nxml-mode 写 content mathml,导出时加一个 XSLT pass 转成 presentation mathml

我的文章都是用 DocBook XML 写的,用 XSLT 导出 HTML5

https://ldbeth.sdf.org/articles/linear.html

笔者未尝试过此方案,有兴趣的读者可自行探索。

tex2MathML

既然 MathML 原生支持网页,并且能提供完整的数学支持,那么将 LaTeX 转换成 MathML 也是一种思路。

Mathjax 和 KaTeX 就是这样的方案,只是它们对 LaTeX 语法并没有完整支持。

其他方案还包括:

  • Temml,由 xTpx 推荐5。  
    从其官网的示例可见,它支持 LaTeX 的 def 命令,因此可能也有完整支持 LaTeX 的能力。
  • LaTeXML
  • TeXZilla

这些方案笔者均没有详细了解,读者可自行探索。

Sphinx

这种方案是 Ilya.w 推荐给笔者的6

与 Hugo 类似,Sphinx 也是一种静态网站生成器,支持的语言有 reStructuredText 和 MyST markdown 两种。

它可以将 LaTeX 公式转换为图片,因此对 LaTeX 数学公式有完整的支持7

由于笔者个人对 Sphinx 不太感冒,最终也没有采用此方案,有兴趣的读者可自行探索。

总结

目前,主流的 LaTeX 网页支持采用的是 Mathjax 或 KaTeX 这种基于 MathML 的方案,它们对 LaTeX 的支持并不全面。

而为了完整地支持 LaTeX,主要的思路是将它转换为 svg 或 png 等图片来嵌入网页,代价是一定程度上增加了加载网页所需的流量及时间。8

此外,也有其他基于 MathML 的方案,其中有一些也同样是将 LaTeX 转换为 MathML,在语法支持的完整性等方面似乎部分优于 Mathjax 与 KaTeX;而另一种方案则完全不依赖 LaTeX,而是直接用(类)XML 的标记语言来转换为 MathML。


  1. 比如,相比 PDF 文件,网页支持自适应布局、更强大的交互性,也可直接在线浏览,在用户界面上网页也更有可读性和美观性,导航等操作也是网页更胜一筹。 ↩︎

  2. 作为笔记系统,至少要有跨不同页面的侧边树型导航栏与搜索功能。 ↩︎

  3. https://developer.mozilla.org/zh-CN/docs/Web/MathML ↩︎

  4. https://emacs-china.org/t/latex/26718/6 ↩︎

  5. https://emacs-china.org/t/latex/26718/8 ↩︎

  6. https://emacs-china.org/t/latex/26718/14 ↩︎

  7. https://www.sphinx-doc.org/en/master/usage/extensions/math.html ↩︎

  8. 笔者最终选择的是 Emacs+Org-mode+ox-hugo+Hugo 的工作流。 ↩︎