61 lines
1.9 KiB
Markdown
61 lines
1.9 KiB
Markdown
# 前端程序员工作规范
|
|
|
|
## 工作目录
|
|
- **主目录**: `frontend/`
|
|
- **源代码目录**: `frontend/src/`
|
|
- **组件目录**: `frontend/src/components/`
|
|
- **页面目录**: `frontend/src/pages/`
|
|
- **样式目录**: `frontend/src/styles/`
|
|
- **测试目录**: `frontend/tests/`
|
|
- **文档目录**: `frontend/docs/`
|
|
|
|
## 开发规范
|
|
|
|
### 代码结构
|
|
```
|
|
frontend/
|
|
├── src/ # 源代码
|
|
│ ├── components/ # 可复用组件
|
|
│ ├── pages/ # 页面组件
|
|
│ ├── hooks/ # 自定义Hooks
|
|
│ ├── services/ # API服务
|
|
│ ├── utils/ # 工具函数
|
|
│ ├── styles/ # 样式文件
|
|
│ └── types/ # TypeScript类型定义
|
|
├── tests/ # 组件测试
|
|
├── docs/ # 组件文档和开发文档
|
|
└── package.json # 依赖管理
|
|
```
|
|
|
|
### 开发流程
|
|
1. 在 `frontend/src/` 中编写UI组件和页面
|
|
2. 在 `frontend/tests/` 中编写组件测试
|
|
3. 在 `frontend/docs/` 中编写组件文档
|
|
4. 开发前需在 `docs/ui-design-spec.md` 中查看UI设计规范
|
|
|
|
### 代码提交规范
|
|
- 提交信息格式: `[frontend] <类型>: <描述>`
|
|
- 类型: feat, fix, style, refactor, test, chore
|
|
- 示例: `[frontend] feat: 添加项目列表组件`
|
|
|
|
### 禁止事项
|
|
- ❌ 不得在 `backend/` 或 `testing/` 目录中工作
|
|
- ❌ 不得修改后端API（需协调后端程序员）
|
|
- ❌ 不得提交未经过测试的代码
|
|
|
|
## UI组件要求
|
|
- 所有组件必须在 `frontend/docs/components.md` 中文档化
|
|
- 文档包含: 组件名称、Props、使用示例、截图
|
|
- 遵循设计规范 `docs/ui-design-spec.md`
|
|
|
|
## 测试要求
|
|
- 关键组件必须有单元测试
|
|
- 测试文件命名: `<组件名>.test.tsx` 或 `<组件名>.spec.tsx`
|
|
- 使用Jest或Vitest测试框架
|
|
|
|
## 技术栈
|
|
- 框架: React/Vue/Angular
|
|
- 状态管理: Redux/Vuex/Zustand
|
|
- 样式: Tailwind CSS/CSS Modules
|
|
- 构建工具: Vite/Webpack
|