MDX 功能测试

这是一个 .mdx 文件。它既支持 Markdown，也支持 JSX、变量、表达式、组件和导入导出。

---

1. 普通 Markdown

粗体、斜体、删除线、行内代码。

• 列表项 A
• 列表项 B
• 列表项 C

这是 MDX 中的 Markdown 引用。

---

2. JSX 表达式

当前测试难度：advanced

元数据来源：MDX test file

版本：1.0.0

简单计算：6

字符串表达式：Astro + MDX

布尔条件渲染：

当前是高级测试。

---

3. JSX 元素

---

4. 数组渲染

#Markdown#MDX#Astro

---

5. 组件测试

下面假设你有：

src/components/Alert.astro
src/components/Card.astro

MDX Card

这是传给组件 slot 的内容。

---

6. Markdown 与 JSX 混合

Markdown inside component

组件内部标题

• 组件内部列表 A
• 组件内部列表 B

组件内部代码

---

7. 代码块

type ButtonProps = {
  children: React.ReactNode;
};

export function Button({ children }: ButtonProps) {
  return <button>{children}</button>;
}

---
const title = "Astro Component";
---

<h1>{title}</h1>

---

8. 表格

能力	Markdown	MDX
普通文章	✅	✅
JSX 表达式	❌	✅
导入组件	❌	✅
导出变量	❌	✅
复杂交互	❌	✅

---

9. HTML / details

点击展开 MDX details

这里是 details 内容。

---

10. 注意事项

MDX 文件中不能完全照搬 .astro 组件语法。

例如，MDX 里不能这样写：

---
const title = "这不是 MDX 顶部脚本";
---

MDX 顶部应该使用 import / export，不是 Astro frontmatter 脚本。

---

结束

如果此文件可以正常构建，说明 MDX 基础能力测试通过。