使用 MDX
关于在 Astro 中使用 MDX 的指南。
这个主题已经安装并配置了 @astrojs/mdx 集成,配置位于 astro.config.mjs 文件中。如果您不想使用 MDX,可以通过从配置文件中删除该集成来禁用它。
为什么选择 MDX?
MDX 是 Markdown 的一种特殊风味,支持嵌入 JavaScript 和 JSX 语法。这开启了在 Markdown 内容中混合使用 JavaScript 和 UI 组件的能力,例如交互式图表或警告框。
如果您已有的内容是用 MDX 编写的,那么这个集成有望让您轻松迁移到 Astro。
示例
这里展示了如何在 MDX 中导入和使用 UI 组件。 当您在浏览器中打开此页面时,应该会看到下面的可点击按钮。
MDX 中的嵌入组件
更多链接
- MDX 语法文档
- Astro 使用文档
- 注意: 仍然需要 客户端指令 来创建交互式组件。否则,默认情况下 MDX 中的所有组件都将渲染为静态 HTML(无 JavaScript)。