Mkdocs 材料 LaTeX 不在即时模式下呈现答案

【问题标题】：Mkdocs material LaTeX not rendering in instant modeMkdocs 材料 LaTeX 不在即时模式下呈现
【发布时间】：2020-07-29 03:16:51
【问题描述】：

我正在尝试在 Mkdocs Material 主题中使用 KaTeX。当“即时模式”关闭时，一切正常。但是，在instant mode 中，仅呈现我首先输入的页面中的 KaTeX，而其余的 KaTeX（单击内部链接时加载）保持为纯文本，并带有分隔符 \( 和 \)。要渲染这些 KaTeX，我必须刷新整个页面。我该如何解决这个问题？

我尝试了 3 段 JavaScript，但它们的行为都如上文所述。

document.addEventListener('DOMContentLoaded', function() {
  renderMathInElement(document.body, {
    delimiters: [
      {left: '\\[', right: '\\]', display: true},
      {left: '$$', right: '$$', display: true},
      {left: '\\(', right: '\\)', display: false},
      {left: '$', right: '$', display: false},
    ]
  });
});

document.onreadystatechange = function () {
  if (document.readyState == "complete") {
  renderMathInElement(document.body, {
    delimiters: [
      {left: '\\[', right: '\\]', display: true},
      {left: '$$', right: '$$', display: true},
      {left: '\\(', right: '\\)', display: false},
      {left: '$', right: '$', display: false},
    ]
  });
  }
}

https://facelessuser.github.io/pymdown-extensions/extensions/arithmatex/#loading-katex

此外，Arithmatex 扩展已开启。在mkdocs.yml:

markdown_extensions:
  - pymdownx.arithmatex:
      generic: true

【问题讨论】：

标签： mkdocs

【解决方案1】：

MathJax 3 会自动处理这个问题，并且应该与 Material 开箱即用的即时加载一起使用。有关设置说明，请参阅 https://squidfunk.github.io/mkdocs-material/reference/mathjax/#arithmatex。

如果您希望使用另一个不会捕捉位置变化的即时加载排版库，您可以自己监听它们并通过添加一些额外的 JavaScript 重新触发排版：

app.location$.subscribe(function() {
  // instant loading finished
})

【讨论】：

好吧，因为即时模式是为了更快地加载，所以就我而言，比 MathJax 更快的 KaTeX 将是一个更好的选择。我猜测 KaTeX 集成中的问题是在 JavaScript 中何时以及如何调用 rederer 函数。
我在上面编辑了我的答案以包含一个示例，如何使用另一个排版库来实现这一点。