[前回までの記事]

経緯

mathjax のバージョンを 3 系 にアップデートした際に単純にいかなかったので備忘録として残しておく

手順

参考 を見ながらアップデートする ※version2 から version 3 への変換を利用

  1. partials フォルダ配下の以下のファイルを修正する

CDN で提供されている最新の MathJax.js の URL は、cdnjs.com で確認する

<script type="text/javascript">
  MathJax = {
    tex: {
      inlineMath: [['$','$'], ['\\(','\\)']],
      processEscapes: true,
      tags: "ams",
      autoload: {
        color: [],
        colorV2: ['color']
      },
      packages: {'[+]': ['noerrors']}
    },
    chtml: {
      matchFontHeight: false,
      displayAlign: "left", // version 2 で css で変更していた 数式の表示位置の設定
      displayIndent: "2em"
    },
    options: {
      skipHtmlTags: ['script', 'noscript', 'style', 'textarea', 'pre'],
      renderActions: {
        /* これを記述しないと インライン数式(例. ${}_n \mathrm{ P }_k$) が機能しない */
        find_script_mathtex: [10, function (doc) {
          for (const node of document.querySelectorAll('script[type^="math/tex"]')) {
            const display = !!node.type.match(/; *mode=display/);
            const math = new doc.options.MathItem(node.textContent, doc.inputJax[0], display);
            const text = document.createTextNode('');
            node.parentNode.replaceChild(text, node);
            math.start = {node: text, delim: '', n: 0};
            math.end = {node: text, delim: '', n: 0};
            doc.math.push(math);
          }
        }, '']
      }
    },
    loader: {
      load: ['[tex]/noerrors']
    }
  };
</script>
<script type="text/javascript" async src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-chtml.js" id="MathJax-script"></script>
  1. 1 で作成した partial を head or footer で読込

例 head で読込

<head>
  ・・・
  {{ partial "mathjax_support.html" . }}
</head>

チートシート ※追加分のみ

複数行で =(イコール) の位置を揃える

番号あり

[記入例]

\begin{align}
f(x) &= x^2+3x+2 \\\\\\
&= (x+1)(x+2)
\end{align}

[表示例]

\begin{align} f(x) &= x^2+3x+2 \\\ &= (x+1)(x+2) \end{align}

番号なし

[記入例]

\begin{align*}
f(x) &= x^2+3x+2 \\\\\\
&= (x+1)(x+2)
\end{align*}

[表示例]

\begin{align*} f(x) &= x^2+3x+2 \\\ &= (x+1)(x+2) \end{align*}