ブログにKaTeXを導入して数式を表示できるようにした。

このブログを作った当初の欲しい機能に入っていたものの、なかなかやる機会がなかったのでやっと導入できてちょっと満足😊

試しに書いてみる

インライン

辺の数を $E$ としたときに、時間計算量は $O(E)$

分数

いろいろ

導入方法のメモ

Markdown中の数式をKaTeXで表示する方法を雑にメモしてみる。

日本語の記事を探すと markdown-it を使った方法しか見つけられなかったけど、remark を使ってる人も結構多いと思うのでここでは remark を使ってる場合の方法を書いてみる。

** 結論から言うと、remark-math というライブラリがあるのでこれを使うと良い。👍**

remark-math

remark-math はremarkのエコシステム上でMarkdown中の数式をパースしてくれるライブラリで、具体的には $ を inlineMath node、$$ を math node としてパースしてくれる。

これを使えば inlineMath node や math node としてMarkdown中の数式を抽出できるので、KaTeXに数式を渡せるようになる。

あとはKaTeXのAPI katex.renderToString に抽出した数式を渡してレンダーしてもらえばok。

rehype-katex というのがあるので rehype も使ってる場合は reamark-math に通したものを rehype に変換後、rehype-katex をかませれば良さそう（rehype-katex の中でよしなに katex.renderToString してくれる。）

Notice: 最近 remark-parser に大きな変更があり、remark-math のバージョンと remark-parser のバージョンがあってないと何も動かなくなるので要注意。