こんにちわ

定期的にリセット癖を発動するのでまた作り直した。

Next.js の v10 がリリースされたらしいが、変更点よく分かってないしゼロから構築しなおしたから、体感として何が変わったかはよく分かってない。unified というか remark 周りのバージョンも上がってるようで、 remark-frontmatter が動かなかったので適当にプラグインっぽいの噛ませた。他にも remark-footnotes と remark-math がうまく動いてないのは確認してるけど、使う機会があまりなさそうだったので放置。

import unified from "unified";
// @ts-ignore
import syntax from "micromark-extension-frontmatter";
import fromMarkdown from 'mdast-util-from-markdown';
// @ts-ignore
import frontmatter from 'mdast-util-frontmatter';

const frontmatterPlugin: unified.Plugin<any> = (options: any) => {
  const transformer: unified.Transformer = (tree, file) => {
    return fromMarkdown(file, {
      extensions: [syntax(options)],
      mdastExtensions: [frontmatter.fromMarkdown(options)],
    });
  };

  return transformer;
};

export default frontmatterPlugin;

内容は mdast-util-frontmatter のサンプルコードを unified 用にラッパーに突っ込んだだけ。そのうち remark-frontmatter が修正されると思うので間に合わせで。

記事自体は Markdown でローカルに持っている物を Netlify でビルドするようにしている。Vercel じゃないのはそのうち別の何かを Vercel でやってみたいと思ってるので。思ってるだけで予定ないけど。

remark-frontmatter の代替品を作る上で AST (Abstract Syntax Tree) を見る機会があったんだけど、JSON (Object) になってるから、他で何か HTML を加工する際にも AST に変換かけてから加工した方が使い勝手いいんじゃないかと思った。思ったけどそこまでするなら普通に DOM API にアクセスしてデータ加工した方が早そうって結論になった。