在 github 页面上使用 Jekyll 在 MathJax 中渲染一些乳胶语法时遇到问题答案

【问题标题】：Trouble rendering some latex syntax in MathJax with Jekyll on github pages在 github 页面上使用 Jekyll 在 MathJax 中渲染一些乳胶语法时遇到问题
【发布时间】：2018-10-02 21:03:28
【问题描述】：

我发现一些 Latex 语法在我的 git 页面中没有使用带有 Jekyll 的 MathJax 呈现。

例如在this发帖

这一行： $z = \overbrace{\underbrace{x}\text{real} +\underbrace{iy}\text{imaginary}}^\text{复数}$

应该是这样的

其他一些乳胶语法也很好用，比如this

我应该添加什么来解决这个问题？我猜 MathJax 没有加载所需的库（例如，在上述情况下为 \usepackage{amsmath}）。

页面代码为here。

以下代码展示了我对matjax的配置。

<script type="text/x-mathjax-config"> MathJax.Hub.Config({ TeX: { equationNumbers: { autoNumber: "all" } } }); </script>
<script type="text/x-mathjax-config">
  MathJax.Hub.Config({
    tex2jax: {
      inlineMath: [ ['$','$'], ["\\(","\\)"] ],
      processEscapes: true
    }
  });
</script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.1/MathJax.js?config=TeX-AMS-MML_HTMLorMML" type="text/javascript"></script>

【问题讨论】：

标签： latex jekyll mathjax

【解决方案1】：

请注意，在 Jekyll 的 Markdown 语法中，下划线用于指示斜体文本，因此 Jekyll 在 \text{real} +\underbrace{iy} 周围插入了 <em> 标签，其中下划线所在的位置（注意输出中缺少下划线并且文本位于斜体）。 MathJax 无法处理包含 HTML 标记的数学运算，因此跳过此数学方程式。

您需要确保 Markdown 不会干扰您的 TeX 符号。这可以通过多种方式完成。您可以使用 \_ 而不是 _ 以防止下划线被解释为斜体。或者，您可以使用<span>...</span> 围绕内联数学和<div>...</div> 围绕显示数学，如建议的here。

【讨论】：

对于不熟悉 HTML 的人来说，下划线问题真的很难识别。 :) 多亏了这篇文章，我发现许多其他帖子都详细介绍了几乎相同的解决方案。问题是，它不适用于displayMath，即 $$x\_y$$ 不会导致 y 被下标，即使 $x\_y$ 确实如此。对于inlineMath 和displayMath 都一致的解决方案有什么想法吗？

【解决方案2】：

只是预感，但查看您的问题中发布的代码，我认为将所有与 MathJax 相关的 stuff 保留在 <script> 标记中可能会更好。我写这个是因为我还没有发现需要在<span> 中包装任何东西。

这是我的_includes/mathjax.html 文件的样子，将docs 中的两个块拼凑在一起...

<script type="text/javascript" async
  src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.5/MathJax.js?config=TeX-AMS-MML_HTMLorMML">
  MathJax.Hub.Config({
    tex2jax: {
      inlineMath: [['$','$'], ['\\(','\\)']],
      processEscapes: true
    }
  });
</script>

...这就是我包含它的方式...

---
layout: post
title: Some of Thing
---
{%- include mathjax.html -%}

Notes about $ \sum_{Thing} $

注意配置是如何与 sourcing (src="<url-or-path>") 在同一 <script> 标记中的，

为了完整性，post source 与 rendered post 一起使用，它使用 $$ 在源代码的前 30 行内进行多行格式化，然后是 $ 行内处理方式就在渲染版本的第一个 code 格式化块（在注释内）之后。

而且（我想是为了加分），我认为更正后的代码可能看起来像问题。

<script src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.1/MathJax.js?config=TeX-AMS-MML_HTMLorMML" type="text/javascript">
  MathJax.Hub.Config({ TeX: { equationNumbers: { autoNumber: "all" } } });
  MathJax.Hub.Config({
    tex2jax: {
      inlineMath: [ ['$','$'], ["\\(","\\)"] ],
      processEscapes: true
    }
  });
</script>

另一件值得注意的事情是我发现我的测试是 $ ... \sum_{Thing} ... $，内联语法 not 触发了任何预解析器Jekyll 用来给这些东西添加 html 标签；换句话说，即使在为 MathJax 的 srcing 添加任何配置之前，我也必须使用 $ ... \sum_{Thing} ... $ 语法。

对于那些已经走到这一步但出于某种原因想要减少 CDN 使用的人，你可能会对我发布的 other answer 感兴趣.

对于那些想要一些 Liquid 到 JavaScript 配置转换的人，liquid-utilities/includes-mathjax 现在可用；允许通过 _config.yml 和单个帖子/页面 FrontMatter 配置 MathJax。

【讨论】：