前言
Frosti 中有很多内置的 mdx 组件，今天就来讲一下如何使用这些组件。
正文
准备
首先需要在存放文章的 \src\content\blog 文件夹里面创建一个 mdx 后缀的文件。
引用
Frosti 提供的组件放置在 /mdx 文件夹中。在文件属性中写下：
import Collapse from "../../components/mdx/Collapse.astro";
import Diff from "../../components/mdx/Diff.astro";
import Error from "../../components/mdx/Error.astro";
import Info from "../../components/mdx/Info.astro";
import Kbd from "../../components/mdx/Kbd.astro";
import Success from "../../components/mdx/Success.astro";
import Warning from "../../components/mdx/Warning.astro";
import TimeLine from "../../components/mdx/TimeLine.astro";
import LinkCard from "../../components/mdx/LinkCard.astro";使用例
折叠文字
(。・ω・。)你好呀！
（；´д｀）我被隐藏了……
<Collapse title="(。・ω・。)你好呀！">
（；´д｀）我被隐藏了……
</Collapse>对比图
<Diff l="/image/l.png" r="/image/r.png" />错误
(っ °Д °;)っ加载失败，请检查你的网络状态！
<Error>(っ °Д °;)っ加载失败，请检查你的网络状态！</Error>警告
如果下方没有评论区请刷新页面
<Warning>如果下方没有评论区请刷新页面</Warning>信息
这只是一条信息
<Info>这只是一条信息</Info>成功
大功告成！
<Success>大功告成！</Success>按键
用 Ctrl + C 来复制文本.
用 <Kbd>Ctrl</Kbd> + <Kbd>C</Kbd> 来复制文本.时间线
<TimeLine
items={[
{ year: "1984", event: "第一台 Macintosh 计算机" },
{ year: "1998", event: "iMac" },
{ year: "2001", event: "iPod" },
{ year: "2007", event: "iPhone" },
{ year: "2015", event: "Apple Watch" },
]}
/>链接卡
<LinkCard
title="Fanzhuo's blog"
desc="我的博客链接"
url="https://blog.fanzhuo.xyz/"
img="/logo.png"
/>官方文档：Using mdx in Frosti↗
Thanks for reading!