项目介绍
全面了解 docs 文档站点的定位和核心功能
📚 Docs 项目介绍
Hey,同学!想拥有一个专业的技术文档站点吗?这一篇给你介绍 iFluxArt 的文档系统~ 📖
🤔 Docs 是干嘛的?
Docs 是 iFluxArt 的文档发布系统,专门为技术文档、知识库、API 参考等场景设计。
💡 想象一下:Docs 就像是你的「数字图书馆」—— 整理得井井有条,想找什么一翻就找到!
🏗️ 项目定位
| 维度 | 说明 |
|---|---|
| 定位 | 技术文档与知识库 |
| 面向用户 | 开发者、团队成员、读者 |
| 技术栈 | Next.js 16 + MDX + 自研组件 |
| 部署位置 | Vercel(独立项目) |
✨ 核心功能
📝 MDX 写作
- 完整的 Markdown 语法
- React 组件支持
- 自定义 MDX 组件库
📂 分类管理
- 文件夹层级结构
_meta.json配置导航- 自动目录生成
🔍 搜索功能
- 全文搜索
- 搜索结果高亮
- 快速定位
🏷️ 标签系统
- 标签云展示
- 标签筛选
- 相关文档推荐
💬 互动功能
- Giscus 评论
- 页面反馈
🔎 SEO 优化
- Meta 标签
- Sitemap
- 结构化数据
🔧 技术设计
为什么选择 MDX?
MDX 让文档既保持 Markdown 的简洁,又有 React 的强大:
markdown
# 安装指南
按照以下步骤安装:
<Steps>
<Step>
安装依赖:`pnpm install`
</Step>
<Step>
配置环境变量
</Step>
</Steps>
> 💡 提示:推荐使用 pnpm!
组件系统
Docs 内置了丰富的 MDX 组件:
| 组件 | 用途 |
|---|---|
Callout | 提示框 |
Steps | 步骤条 |
MDXTabs | 标签页 |
Tree | 树形结构 |
Mermaid | 图表 |
CodeGroup | 代码组 |
🎯 适用场景
| 场景 | 推荐用法 |
|---|---|
| 开源项目文档 | 多级目录、API 参考 |
| 个人知识库 | 标签、搜索 |
| 团队内部 Wiki | 权限控制(未来) |
| 产品手册 | 版本管理(未来) |
📊 与其他项目的关系
text
Web (入口)
│
└──🔗 链接──→ Docs (文档)
│
└──💬 Giscus (评论)
│
└──🔍 搜索服务
│
└──🗂️ 文件系统
📖 下一步
📚 好的文档是「传道授业解惑」的基石!