创建文章
你可以使用 Fuwari 的内置脚本或者手动创建文章。
使用内置脚本
在终端中执行以下命令,将 <filename> 替换为你想要的文件名(不要包含空格):
pnpm new-post <filename>脚本执行后,会在 src/content/posts/ 目录下生成一个对应的 .md(Markdown)文件,并自动生成文章的 frontmatter(见下文)模板。你可以直接用 VSCode 打开它进行内容编辑。
手动创建
你也可以完全手动地创建文章文件。
- 创建文件:在
src/content/posts/文件夹中的任意位置新建一个.md或.mdx文件。- 强烈建议在该目录下创建子目录来更好地整理文章和相关资源。
- 文件所在的目录及名称会直接对应文章的网址。
- 编写内容:在新文件中,你需要先在文章开头手动填写文章的
frontmatter(见下文),然后再写正文。
文章 Frontmatter
每篇文章的开头都必须按格式填写 frontmatter。Fuwari 会自动识别这部分内容,并转化为对应的帖子信息。
---title: My First Blog Post # 文章的标题published: 2026-07-31 # 帖子的发布日期updated: 2026-08-01 # 帖子的更新日期description: This is the first post of my new Astro blog. # (可选)对文章的简单描述,会显示在首页上。不写该属性则默认使用文章的第一句话image: ./cover.jpg # (可选)文章的封面图片路径# 1. 以 http:// 或 https:// 开头:使用网络图片# 2. 以 / 开头:用于 public 目录中的图片# 3. 无前缀:相对于本 Markdown 文件tags: [Foo, Bar] # (可选)文章的标签category: Front-end # (可选)文章的分类,留空则归为“未分类”draft: false # (可选)文章是否为草稿。默认为 false,改为 true 则会在本地开发时可见、正式构建后不可见lang: jp # (可选)仅当文章语言与 config.ts 中的网站语言不同时需要设置---简单 Markdown 语法
Fuwari 的文章默认使用 Markdown 语法。你可以把下面的演示代码复制到文章中,在网页上查看对应的效果。
# 一级标题## 二级标题### 三级标题#### 四级标题
*斜体*,_斜体_,**粗体**,__粗体__,`等宽字体`,~~删除线~~,<u>下划线</u>
- 列表 1 - 子列表 a - 子列表 b- 列表 2
1. 编号 12. 编号 2
> 这是引用块>> 可持续多行>>> 可进行嵌套
```python title="test.py"print("这是代码块")```
| 表头 | 自动 | 加粗 || --- | --- | --- || 这是 | 一个 | 表格 || 这是 | 一个 | 表格 |
这是一个指向[网站](https://prerice.novic.cc)的链接,以及一个指向[当前文档中章节标题](#二级标题)的链接。
插入图片:

这是分隔线:
---
反斜杠可以用于 \`转\` \*义\*这里没有介绍的 Markdown 语法还有很多,可以自行了解。
Markdown 扩展功能
Fuwari 还支持 Markdown 的一些扩展功能。
视频嵌入
主流视频平台的分享按钮中一般都能直接复制嵌入代码,粘贴到文章中即可,并按需修改 width、height 等属性。
<iframe width="100%" height="450" src="//player.bilibili.com/player.html?isOutside=true&aid=80433022&bvid=BV1GJ411x7h7&cid=137649199&p=1" title="示例视频" allowfullscreen></iframe>GitHub 仓库卡片
你可以使用 ::github{repo="<所有者>/<仓库>"} 添加动态卡片来链接 GitHub 仓库。页面加载时,卡片会自动从 GitHub API 拉取仓库信息。
提示块
支持以下五种类型的提示块:note(注意)、tip(提示)、important(重要)、warning(警告)、caution(小心)。
以 note 为例:
:::note[自定义标题]这是一个 note 提示块:::自定义标题这是一个 note 提示块
Fuwari 同样支持 GitHub 语法。
> [!TIP]> GitHub 语法同样支持。TIPGitHub 语法同样支持。
剧透(Spoiler)
你可以在文本中添加会被隐藏的剧透内容,其中的文本同样支持 Markdown 语法。
这段内容:spoiler[被 **隐藏** 了]!这段内容
更多
Expressive Code
Expressive Code 是一个用于在网页上呈现源代码的引擎,旨在让代码示例更易于理解且视觉上更吸引人。
Fuwari 集成了对 Expressive Code 的支持。如果你希望自己博客中的代码块具备更丰富的视觉效果,可以学习并使用它。Fuwari 的默认帖子中也有一篇相关的示例文章。
MDX
Fuwari 除了支持 .md 格式,还支持 .mdx 格式。
MDX 可以看作是 Markdown 的超集。它在 Markdown 的基础上增加了在文档中直接使用 JSX(JavaScript XML)语法和 React 组件的能力,让文档从一个静态页面变成了一个充满可能性的动态应用。因此,.mdx 文件非常适合编写交互式技术文档、组件库使用说明、博客等需要嵌入复杂 UI 或动态内容的场景。
Typst (夹带私货)
Typst 是一个现代化的 开源 排版系统,使用 Rust 语言编写,旨在为科学写作提供一种更快速、更简单、更强大的排版解决方案。你可以将其理解为 LaTeX 的强大替代品,同时拥有比 Markdown 更强大的排版能力。
Typst 具有语法简洁、学习成本低、源代码可读性高、编译速度极快、可即时预览等诸多优点。不过作为一个诞生仅几年的新兴工具,Typst 在成熟度、稳定性和生态上还存在一定的不足。
Markdown 的数学公式普遍采用 LaTeX 的语法格式。如果你像我一样有大量公式编辑和排版的需求,同时不喜欢 LaTeX 的繁杂和臃肿,那么——加入 Typst 吧!感受了 Typst 的舒适后,我真的再也不想用 LaTeX 哪怕一次了。
虽然 Fuwari 并不原生支持 Typst,但社区维护的 astro-typst 集成已经实现了在 Astro 项目中直接渲染 Typst 文档。同时,Typst 本身也在完善 HTML 导出的实验性支持,未来很可能会有更原生、更简单的集成方式出现。
对于这类个性化的需求,下一步便是改造这个网站!