HelloRusk

reading and coding ...

Next.js + MDX で数式を扱う

11/8/2019, 2:26:14 PM - 253 days ago

Next.js と MDX で構築されたこのブログで、TeX を扱えるようにしていきたいと思います。
まず、@mdx-js/loader を入れます。これは next.config.js 内で MDX 向けのプラグインをカスタマイズするのに必要です。入っていなければ、

npm install @mdx-js/loader

してください。

その後は、

npm install remark-math
npm install rehype-katex

してから、ドキュメンテーション通りに next.config.js を編集しましょう。

このブログのリポジトリのコミットも参考にしてください。

これで TeX を使う準備が整います。
MDX 内で KaTeX CSS を挿入する必要があることにも注意しましょう（数式をブログでよく使う人は、ブログのテンプレートにCSSの部分も加えた方がいいかもしれませんね！）。

L = \frac{1}{2} \rho v^2 S C_L

f(x) = \int_{-\infty}^\infty \hat f(\xi)\,e^{2 \pi i \xi x} \,d\xi

これで無事に $\TeX$ が使えるようになりましたね！