先週、原一浩の UI カンソクスケッチ という連載をスタートさせました。
この連載は、MDX を使って書かれていて、MDX というのは、Markdown の拡張で、React コンポーネントをそのまま Markdown 内に埋め込めるというフォーマットです。
つまり、リッチなユーザーインターフェースを持ったコンポーネントをコンテンツとして掲載できるということです。
様々なユーザーインターフェースをプロトタイプ的に実装しつつコラムを書くコーナーを目指しているので、MDX はピッタリというわけです。
さて、この MDX 、先日バージョン 1.0 が出ました。
現在もうバージョン 1.0.4 になっており、勢いがあります。
リリースノートはこちら。
一年半かけて、MDX の Stable 版 (安定板) になったということです。MDX の構文解析の向上、MDX の構文拡張の機能、カスタムプラグマなどが What's new として記載されておりました。
カスタムプラグマについては、こちらを見てください。
構文拡張、カスタムプラグマについては、追ってじっくり見ていきます。
また、変更点は以下のとおり。
@mdx-js/tagは、@mdx-js/reactと@mdxプラグマによって置き換えられましたMDXProviderは、ネストされたコンポーネントのコンテキストをマージするようになりました- React サポートは、
@mdx-js/reactにて 16.8 以降となりました (react@16.8とreact-dom@16.8)
非推奨になったものは、mdPlugins と hastPlugins で、それぞれ remarkPlugins と rehypePlugins となっています。古いほうの機能は、バージョン 2 にて削除予定とのことです。
バージョン 0 からバージョン 1 へのマイグレーションガイドは以下にあります。
このサイトでもバージョン 1 系にアップグレードすることを検討していきます。(たぶん大丈夫だと思いますが、依存している別のパッケージなどの兼ね合いもあり、テストする必要がありそうです)
ARTICLES
AUTHOR
原 一浩
カンソクインダストリーズ代表 / グレーティブ合同会社代表
1998年に独立し、同年、ウェブデザイン専門のメールメディア DesignWedgeの発行を開始。Webデザイン業の傍ら、海外のWebデザインに関する情報発信を行う。
雑誌への寄稿多数。主な著書に『はじめてのフロントエンド開発』『プロセスオブウェブデザイン』、『Play framework徹底入門』、『ウェブデザインコーディネートカタログ』など。自社製のWebデザインのクロール＆キャプチャシステムvaqumをベースに、様々なリサーチを行っている。Web 検定プロジェクトメンバー。