react-markdown で数式を表示させる
react-markdown を使って Markdown 形式の記事を SSG する際に数式もいい感じに表示できるようにした。
といっても、react-markdown の README.md に書かれているとおりの手順を進めるだけ(この記事は半分数式のテスト表示のため...)。
導入手順
以下の 2 ステップ
- yarn add remark-math rehype-katex
- ReactMarkdown 要素の rehypePlugins に rehypeKatex を追加、remarkPlugins に remarkMath を追加
Read More+ import remarkMath from 'remark-math' + import rehypeKatex from 'rehype-katex' + import 'katex/dist/katex.min.css' ... ...