このテーマでは @astrojs/mdx が astro.config.mjs に含まれています。MDX を使わない場合は、設定から該当の統合を削除すれば無効にできます。

MDX とは？

MDX は、Markdown の中に JavaScript や JSX を埋め込める形式です。Markdown にコンポーネントを混ぜて書けるので、インタラクティブな図やアラートなどを記事内に配置できます。

すでに MDX で書いたコンテンツがあれば、そのまま Astro に持ってきやすいです。

例

MDX 内でコンポーネントを import して使う例です。ブラウザでこのページを開くと、下のボタンが表示されます。

MDX に埋め込んだコンポーネント

参考リンク

• MDX 公式ドキュメント
• Astro：Markdown と MDX
• 補足: インタラクティブなコンポーネントには Client Directives が必要です。指定しない場合、MDX 内のコンポーネントは静的 HTML として出力され、JavaScript は含まれません。