VitePress 搭建过程
"拉了么"项目 Wiki 的详细搭建步骤
为什么选择 VitePress?
待补充内容
请在这里说明为什么选择 VitePress:
- 对比了哪些其他方案(GitBook、Notion、Docusaurus 等)
- VitePress 的哪些特点吸引你
- 团队的技术背景是否适合使用 VitePress
🚀 搭建步骤
步骤 1:初始化
bash
# 在项目根目录下创建 wiki 目录
cd lamo-project
mkdir wiki
cd wiki
# 初始化 package.json
pnpm init
# 安装 VitePress
pnpm add -D vitepress待补充内容
请在这里补充:
- 项目目录结构是怎样的
- Wiki 放在哪个位置
- 是否把 Wiki 放在单独的仓库
步骤 2:创建基本结构
bash
# 创建文档目录
mkdir -p docs/.vitepress待补充内容
请在这里补充实际的目录结构:
wiki/
├── docs/
│ ├── .vitepress/
│ │ └── config.ts # 配置文件
│ ├── overview/ # 概述章节
│ ├── development/ # 开发章节
│ ├── api/ # API 文档
│ └── deployment/ # 部署文档
├── package.json
└── README.md请补充实际使用的目录结构和说明。
步骤 3:配置 VitePress
typescript
// docs/.vitepress/config.ts
import { defineConfig } from 'vitepress'
export default defineConfig({
title: '拉了么项目 Wiki',
description: '外卖订餐系统项目文档',
base: '/wiki/',
themeConfig: {
sidebar: [
{
text: '项目概述',
items: [
{ text: '项目简介', link: '/overview/intro' },
{ text: '技术栈', link: '/overview/tech-stack' },
]
},
// ... 更多配置
]
}
})待补充内容
请在这里补充:
- 完整的 VitePress 配置文件
- 导航栏配置
- 侧边栏配置
- 主题定制(如果有)
步骤 4:添加内容
markdown
<!-- docs/overview/intro.md -->
# 项目简介
拉了么是一个外卖订餐系统...待补充内容
请在这里说明:
- 第一批添加了哪些文档
- 文档的组织原则是什么
- 如何保证文档的完整性
步骤 5:本地预览
bash
# 添加开发脚本
# package.json
{
"scripts": {
"docs:dev": "vitepress dev docs",
"docs:build": "vitepress build docs",
"docs:preview": "vitepress preview docs"
}
}
# 启动开发服务器
pnpm docs:dev待补充内容
请在这里补充:
- 本地开发体验如何
- 是否遇到问题
- 如何解决的
步骤 6:部署
待补充内容
请在这里补充:
- 部署到哪里(Vercel/Netlify/GitHub Pages/自己服务器)
- 部署配置
- CI/CD 流程(如果有)
- 是否有自定义域名
📁 实际的 Wiki 结构
待补充内容
请在这里展示"拉了么"项目 Wiki 的实际结构:
wiki/
├── docs/
│ ├── index.md # 首页
│ ├── overview/ # 项目概述
│ │ ├── index.md
│ │ ├── intro.md # 项目简介
│ │ ├── tech-stack.md # 技术栈
│ │ └── requirements.md # 需求文档
│ ├── development/ # 开发相关
│ │ ├── index.md
│ │ ├── setup.md # 环境搭建
│ │ ├── structure.md # 项目结构
│ │ ├── guidelines.md # 开发规范
│ │ └── workflow.md # 工作流程
│ ├── api/ # API 文档
│ │ ├── index.md
│ │ ├── user-api.md # 用户 API
│ │ ├── order-api.md # 订单 API
│ │ └── payment-api.md # 支付 API
│ ├── database/ # 数据库
│ │ ├── index.md
│ │ ├── schema.md # 数据模型
│ │ └── er-diagram.md # ER 图
│ ├── deployment/ # 部署
│ │ ├── index.md
│ │ ├── frontend.md # 前端部署
│ │ └── backend.md # 后端部署
│ └── appendix/ # 附录
│ ├── index.md
│ ├── faq.md # 常见问题
│ └── glossary.md # 术语表
└── .vitepress/
└── config.ts请补充实际使用的结构。
🎨 主题定制
待补充内容
请在这里说明:
- 是否定制了主题
- 修改了哪些样式
- 是否添加了自定义组件
- 是否配置了搜索
🔍 搜索配置
待补充内容
请在这里说明:
- 使用什么搜索(VitePress 内置/Algolia/其他)
- 搜索配置方法
- 搜索效果如何
📊 使用效果
开发效率
待补充内容
- 搭建 Wiki 后,开发效率是否有提升
- 举例说明(如:新人上手时间从 X 天缩短到 Y 天)
AI 协作
待补充内容
- AI 使用 Wiki 的效果如何
- 举例说明(如:之前需要解释半天,现在 AI 直接给出准确建议)
团队协作
待补充内容
- Wiki 是否帮助团队更好地协作
- 成员的使用频率如何
💰 成本
待补充内容
请在这里说明搭建和维护 Wiki 的成本:
- 时间成本(搭建、维护)
- 金钱成本(部署、域名)
- 人力成本(写文档、更新文档)
下一步
Wiki 搭建完成后,接下来需要填充内容。在下一节中,我们将详细介绍Wiki 包含哪些内容以及如何组织这些内容。