docs: 添加场景分类与目录结构说明

在 Step 2 添加场景分类章节,明确三种场景:
1. 纯桌面端项目
2. 纯移动端项目
3. 桌面端+移动端混合项目(推荐)

明确不推荐使用两个独立目录(prototype + prototype-mobile),
强调统一目录结构的管理优势。

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Claude Code
2026-03-29 05:27:11 +00:00
parent 3600810cea
commit f77bb8a517

View File

@@ -141,6 +141,78 @@ prototype/
└── device-management.html # 设备管理(独立文件)
```
#### 📁 场景分类与目录结构
根据项目需求,选择合适的目录结构:
**场景 1: 纯桌面端项目**
- 适用对象:管理后台、数据看板、桌面应用
- 目录结构:
```
prototype/
├── admin-index.html # 桌面端平铺入口
├── index.html # 统一入口
├── docs-index.html # 文档中心
├── view-doc.html # 文档查看器
├── server.js
└── pages/
└── admin/ # 桌面端管理页面
```
**场景 2: 纯移动端项目**
- 适用对象:移动应用、手机网页
- 目录结构:
```
prototype/
├── mobile-index.html # 移动端平铺入口
├── index.html # 统一入口
├── docs-index.html # 文档中心
├── view-doc.html # 文档查看器
├── server.js
└── pages/
└── mobile/ # 移动端页面
```
**场景 3: 桌面端+移动端混合项目(推荐)⭐**
- 适用对象:全栈应用、多端支持
- 目录结构:
```
prototype/
├── index.html # 统一入口
├── admin-index.html # 桌面端平铺入口
├── mobile-index.html # 移动端平铺入口
├── docs-index.html # 文档中心
├── view-doc.html # 文档查看器
├── server.js # 唯一服务器
└── pages/
├── admin/ # 桌面端管理页面
└── mobile/ # 移动端页面
```
#### ⚠️ 不推荐的方案
**❌ 错误示例:使用两个独立目录**
```
prototype/ # 桌面端
├── server.js
└── pages/admin/
prototype-mobile/ # 移动端
├── server.js # 重复!
└── pages/mobile/
```
**为什么不推荐:**
- ❌ 维护困难:需要同步更新两个目录
- ❌ 资源浪费:两个 server.js两个端口
- ❌ 代码重复:文档系统、工具函数重复
- ❌ 不符合统一管理原则
**✅ 正确做法:统一管理**
- ✅ 一个 prototype/ 目录
- ✅ 一个 server.js
- ✅ 通过 pages/admin/ 和 pages/mobile/ 组织页面
- ✅ 共享文档系统和工具函数
#### 桌面端页面结构(独立 HTML 文件)
```html