富媒体示例：图片、标签与长文结构

这篇示例文章更接近实际的「长文博客」，你可以用它来测试：

• 列表 + 多级标题的滚动体验
• 博客详情页中的阅读时间、封面图等信息是否正常
• 在首页列表中多篇文章并排展示时的视觉观感

典型使用场景

在 SaaS 产品文档 / 博客中，你可能会写：

• 产品更新日志（Changelog）
• 功能使用教程（How-to）
• 设计或架构思考（Thoughts）

这篇文章可以作为这些内容的「骨架模板」。

图片占位示例

说明：content-collections.ts 中会自动从 MDX 内容里提取 <Image /> 的 src，用于生成图片列表。

下面是一段典型的图片组件占位（如果你有 Image 组件，可以换成实际组件使用）：

// 示例：在文章中使用本地或远程图片
// <Image
//   src="/images/dashboard-preview.png"
//   alt="Dashboard preview"
//   width={1200}
//   height={630}
// />

结构示例：多级标题

1. 背景

简单说明这篇文章要解决什么问题，或者要展示什么能力。

2. 解决思路

用几个小节来解释：

1. 如何组织内容
2. 如何在 MDX 中插入组件
3. 如何在 UI 中展示这些信息

3. 结语

通过这三篇示例博客，你可以快速验证：

• 列表页卡片渲染是否正常（标题、描述、封面、标签、阅读时间）
• 详情页是否能正确渲染长文、代码块、表格等内容
• content-collections 的 schema 与 transform 是否按预期工作

后续只需要根据这几个示例修改文案和 frontmatter，即可快速创建真正的内容。