🟩 もくじ
KaTeXが二個以上の[\overbrace{}_{}][\underbrace{}_{}]を数式で処理しない
- 理由は、MarkdownパーサーGoldmarkがアンダーバー[_]が二個あるとHTMLの強調命令と勘違いして処理しているため。
- HugoのMarkdownパーサーがGoldmarkになってから、指定しなければMarkdownファイル内でHTMLが使えないなど、けっこう面倒なことになっている。
- ■GitHub - yuin/goldmark: :trophy: A markdown parser written in Go. Easy to extend, standard(CommonMark) compliant, well structured.
- 【対策法あり】:
KaTeXを使うための準備
以下のJavaScriptコードをの直前、つまり、
~の間の最も最後に置くように、[C:\Hugo\YourSiteName\layouts\partials][C:\Hugo\YourSiteName\layouts_default]の中のファイルを編集する。<!-- HTML追加開始 -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.16.8/dist/katex.min.css">
<script src="https://cdn.jsdelivr.net/npm/katex@0.16.8/dist/katex.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/katex@0.16.8/dist/contrib/auto-render.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/katex@0.16.8/dist/contrib/mhchem.min.js"></script>
<script>
document.addEventListener("DOMContentLoaded", function() {
renderMathInElement(document.body, {
delimiters: [
{left: "$$", right: "$$", display: true},
{left: "$", right: "$", display: false},
{left: "\\(", right: "\\)", display: false},
{left: "\\[", right: "\\]", display: true}
],
throwOnError: false,
ignoredTags: ["script", "noscript", "style", "textarea", "pre", "code", "a"],
ignoredClasses: ["no-katex"]
});
});
</script>
<!-- HTML追加終了 -->
HugoのMarkdownパーサーがGoldmarkの誤処理への対策|Hugoディレクトリ直下の[config.toml]や[hugo.toml]の内容に、次のような表現を付け加える
危険ながら効果のある方法|hugo.tomlの中身に次の表現を付け加える
# ■<a href="https://github.com/yuin/goldmark/" target="_blank" rel="nofollow">GitHub - yuin/goldmark: A markdown parser written in Go. Easy to extend, standard(CommonMark) compliant, well structured.</a><br>
# ▼Hugoのマークダウンパーサーがyuin/goldmarkに変更されたタイミングで、デフォルトではマークダウン記法とHTML記法の混在ができなかった:それを許容するには[unsafe = true]にする▼
[markup]
[markup.goldmark]
[markup.goldmark.renderer]
unsafe = true
[markup.goldmark.extensions]
[markup.goldmark.extensions.passthrough]
enable = true
[markup.goldmark.extensions.passthrough.delimiters]
block = [['\[', '\]'], ['$$', '$$']]
inline = [['\(', '\)'], ['$', '$']]
[markup.goldmark.parser]
[markup.goldmark.parser.attribute]
block = false
title = false
安全性を考えた方法2-1〔2-2とセットで行ないます〕|[hugo.toml]の中身に次の表現を付け加える|inline = の行が変わっている
# ■<a href="https://github.com/yuin/goldmark/" target="_blank" rel="nofollow">GitHub - yuin/goldmark: A markdown parser written in Go. Easy to extend, standard(CommonMark) compliant, well structured.</a><br>
# ▼Hugoのマークダウンパーサーがyuin/goldmarkに変更されたタイミングで、デフォルトではマークダウン記法とHTML記法の混在ができなかった:それを許容するには[unsafe = true]にする▼
[markup]
[markup.goldmark]
[markup.goldmark.renderer]
unsafe = true
[markup.goldmark.extensions]
[markup.goldmark.extensions.passthrough]
enable = true
[markup.goldmark.extensions.passthrough.delimiters]
block = [['\[', '\]'], ['$$', '$$']]
inline = [['\(', '\)']]
[markup.goldmark.parser]
[markup.goldmark.parser.attribute]
block = false
title = false
安全性を考えた方法2-2|ショートコードを使う|[C:\Hugo\Benkyo\layouts\shortcodes]にmath.html〔EUC / LF〕というファイルを作り次のコード〔二行だけ〕を付け加える
{{ $content := .Inner }}
<span class="math">{{ $content | safeHTML }}</span>
Hugoの記事内〔Markdownファイル〕では、次のように書く。
{{< math >}}
$(a^{n})^{m} = \underbrace{a^{n} \times a^{n} \times \cdots \times a^{n}}_{m} = \underbrace{a \times a \times \cdots \times a}_{m \times n}$
{{< /math >}}
結果として、次のようにアンダーブレースが一行に複数個使える。
$(a^{n})^{m} = \underbrace{a^{n} \times a^{n} \times \cdots \times a^{n}}_{m} = \underbrace{a \times a \times \cdots \times a}_{m \times n}$
なお、ショートコードのサンプルを表示させるためには、次のようにエスケープする必要がある。 中括弧〔全角文字〕は、Hugoのパーサーが反応しないように、意図的に使っている。実際には半角の中括弧を使う。
{{</* math */>}}
{{</* /math */>}}