MDXRemoteでremarkGfmを使う方法
結論
0. Next.jsのアプリケーションを作る、MDXRemoteを入れる
1. remarkGfmのインストール
1npm i remark-gfm@3.0
2# or
3yarn i remark-gfm@3.0
4# or
5pnpm i remark-gfm@3.0現在(2023/11/17)時点ではremarkGfmの最新版だと何故かエラーを吐くのでv3を利用する必要があります。
エラーの例
1Cannot read properties of undefined (reading 'inTable')2.optionsの設定
1import remarkGfm from "remark-gfm";
2
3// --- 省略
4
5<MDXRemote
6 source={renderFile}
7 options={{
8 mdxOptions: {
9 remarkPlugins: [remarkGfm],
10 },
11 }}
12/>;3.以上
このようにしてMDXRemoteでremarkGfmが利用できます。導入は簡単ですが、注意点はremarkGfmのバージョンです。