メインコンテンツまでスキップ

「katex」タグの記事が1件件あります

全てのタグを見る

Docusaurusで数式をクライアントサイドレンダリング(CSR)する

· 約10分
mebiusbox
engineer

Docusaurusは静的サイトジェネレータなので、すべてのページがビルド時にレンダリングされます. DocusaurusのマークダウンからHTMLにレンダリングする部分は remarkrehype が処理しています.数式を有効にするには、Docusaurusのドキュメント によれば、remark-mathrehype-katex (または rehype-mathjax)を使います. しかし、2,3個の数式ならともかく、それなりの数があるとビルドに時間がかかるようになり、生成されるhtmlやjsファイルが肥大化します.もちろん、数式も含めて事前にレンダリングするので、閲覧する場合はブラウザで数式の処理が入らず高速に表示できますが、個人的にはデメリットの方が大きいので、数式処理はクライアントサイドでしたいところです.ここでは、その方法を記録しておきます.