Skip to content
MDX logo
v1.6.21

MDX

让 Markdown 步入组件时代

MDX 是一种书写格式,允许你在 Markdown 文档中无缝地插入 JSX 代码。 你还可以导入(import)组件,例如交互式图表或弹框,并将它们 嵌入到内容当中。 这使得用组件编写较长的内容形成了 一场冲击 🚀。

试一试

Hello, world!

以下是一个 Markdown 中嵌入 JSX 的示例。
试着改变 背景色吧!

❤️ 强大: MDX 将 markdown 和 JSX 语法混合在一起并完美地 融入基于 JSX 的项目当中。

💻 一切皆组件: 导入(import) JSX 组件并 在 MDX 文档中直接渲染它们。

🔧 可定制: 为每一个 markdown 元素决定用哪个组件渲染。 渲染。

📚 基于 Markdown: Markdown 的简洁和优雅依然得到了保存, 只须在需要时才混入 JSX 。

🔥 超级超级快: MDX 没有运行时,所有的编译都发生在 构建阶段。

“It’s extremely useful for using design system components to render markdown and weaving interactive components in with existing markdown.”

@chrisbiscardi

为什么?

在 MDX 出现之前,将 JSX 与 Markdown 混合书写时,Markdown 的优势就不存在了。 通常采是用基于模板字符串的方式,因此就需要大量的 转义和繁琐的语法。

MDX 试图让书写 Markdown JSX 更简单、更具 表现力。当你将组件 (甚至可以是动态的或需要加载数据的组件)与 Markdown 混合书写时,编写较长的内容又会变得 很有趣。

观看部分特色功能的实际效果

Edit this page on GitHub
Next:
入门