Fumadocs 折腾记
内容维护
如何添加文章和新建分组
一、在现有分组中添加新文章
只需在对应文件夹下新建 .mdx 文件即可,无需改任何配置。
每个 .mdx 文件顶部需要有 frontmatter:
---
title: 文章标题
description: 文章描述(可选)
---
正文内容...注意:文件名必须用英文,如 my-first-post.mdx,不要用中文文件名,否则会出现 404 问题。
二、新建一个分组
-
在
content/docs/下创建英文文件夹,如content/docs/life/ -
在该文件夹下创建
meta.json:
{
"title": "生活记录",
"icon": "Heart"
}提示:Fumadocs 使用 Lucide 的图标库,因此 "icon": 只需引入图标库图标名称即可。具体请看第三节。
- 在该文件夹下添加
.mdx文章
完成后的 docs 文件夹结构示例:
index.mdx
三、可用图标
meta.json 中的 icon 字段使用 Lucide 图标名,常用图标有:
| 图标名 | 含义 |
|---|---|
PenLine | 笔 |
Code | 代码 |
BookOpen | 书本 |
Heart | 心 |
Lightbulb | 灯泡 |
Globe | 地球 |
Camera | 相机 |
Music | 音乐 |
Star | 星星 |
Palette | 调色板 |
四、快速操作速查
| 操作 | 做法 |
|---|---|
| 添加文章 | 在对应文件夹下新建 .mdx |
| 添加分组 | 新建文件夹 + 放一个 meta.json |
| 修改分组名 | 编辑对应文件夹的 meta.json 中的 title |
| 删除分组 | 删除整个文件夹 |
| 修改分组图标 | 编辑 meta.json 中的 icon 字段 |
添加文章或分组后,不需要修改 source.config.ts、layout.tsx 或任何配置文件,Fumadocs 会自动识别。开发服务器会自动热更新,生产环境需要重新 pnpm build。
五、维护
写好文章后,将对应的 .mdx 格式文件上传到你需要更新的文件夹中,随后使用终端进行热更新即可。
cd /(请替换为你的实际项目路径)
pnpm build
pm2 restart my-website