Next.js + MDX + Bulma な環境でシンタックスハイライティングを行うときの問題 - ARTICLESこのサイトは、あまり活かせていませんが Bulma という CSS フレームワークを採用しています。 Bulma: Free, open source, & modern CSS framework based on FlexboxBulma は CSS だけで構成されているため使い勝手が良いので気に入っているのですが、MDX にて、コード部分のシンタックスハイライトを行なった場合に問題が発生することがあるので、その話題。 MDX にてコード部分のシンタックスハイライトをする場合、ざっと調べると、Prism を導入するという方法が見つかります。 Prism具体的に Next.js で Prism を使うには、rehype-prism という rehype のプラグインを使う方法があります。これは、ビルド時に MDX のコード記述部分をシンタックスハイライティングの CSS が当たるように変
