1. 技术栈
React
- 优先使用Function Components + Hooks
- Class Components 仅用于：
- Error Boundary
- 特殊生命周期控制
- 遵循 React 最佳实践（状态提升、受控组件、依赖管理）
Vue
- 使用Vue 3 + Composition API
- 禁止 Options API（除历史项目）
- 逻辑统一抽离为
useXxx组合函数
TypeScript
- 禁止使用
any - 必须完整类型定义或类型推断
- Props 必须定义接口
2. 样式规范
- 使用Tailwind CSS（非uniapp的情况下）
- 禁止随意自定义样式
- 禁止滥用 inline style
- 遵循设计系统（Design Tokens）
- 原则：原子化 / 可复用 / 可维护
3. 代码规范
- 使用ES6+
4. 命名规范
| 类型 | 规范 |
|---|---|
| 变量/函数 | camelCase |
| 类/接口 | PascalCase |
| 常量 | UPPER_SNAKE_CASE |
| 组件 | PascalCase |
| 文件 | kebab-case |
5. 组件设计
- 遵循单一职责原则（SRP）
- 禁止巨型组件
- UI 与业务逻辑分离
- 组件必须具备复用性
6. 代码复用
React
- Custom Hooks（优先）
- HOC（横切逻辑）
Vue
- Composition Functions（
useXxx）
通用原则
- 遵循DRY
- 公共逻辑抽取到：
- hooks / composables
- utils
- services
7. API 规范
- 所有请求必须封装在Service 层
- 禁止在组件中直接调用 API
- 请求与业务逻辑解耦
8. 错误处理
- 所有异步操作必须
try/catch - 必须有统一错误处理机制
- 推荐：
- 全局拦截（Axios）
- 错误上报 + 用户提示
9. 跨端（uni-app）
- 必须兼容：
- iOS / Android
- H5
- 小程序
- 使用条件编译
10. 性能优化
- 减少无效渲染：
- React：memo / useMemo / useCallback
- Vue：computed 精准依赖
- 路由懒加载
- 大列表使用虚拟滚动