70 lines
2.0 KiB
Plaintext
70 lines
2.0 KiB
Plaintext
---
|
||
description: Trae 开发规则，定义如何使用 Trae 进行项目开发和维护
|
||
globs: src/**/*
|
||
alwaysApply: true
|
||
---
|
||
|
||
# Trae 开发规则
|
||
|
||
**使用 Trae 进行开发时必须遵循的规则**，确保代码质量和开发效率。
|
||
|
||
## 开发流程
|
||
|
||
1. **需求分析**：理解用户需求，明确功能边界
|
||
2. **代码实现**：按照项目框架规范实现功能
|
||
3. **测试验证**：确保功能正常工作
|
||
4. **文档更新**：同步更新相关文档
|
||
5. **代码检查**：运行 lint 和类型检查
|
||
|
||
## 代码规范
|
||
|
||
### 1. 代码风格
|
||
- 遵循项目现有的代码风格（Prettier + ESLint）
|
||
- 使用 TypeScript 严格模式
|
||
- 避免使用 `any` 类型
|
||
- 函数和变量命名清晰，符合语义
|
||
|
||
### 2. 组件开发
|
||
- 使用 Vue 3 Composition API
|
||
- 组件文件使用 PascalCase 命名
|
||
- 样式使用 `<style scoped>`
|
||
- 组件 props 和 emits 必须有类型定义
|
||
|
||
### 3. API 开发
|
||
- 遵循 XTrader API 接入规范
|
||
- 使用统一的请求封装（`src/api/request.ts`）
|
||
- 为每个接口定义完整的 TypeScript 类型
|
||
- 处理错误和边界情况
|
||
|
||
## 工具使用
|
||
|
||
### 1. 代码生成
|
||
- 使用 Trae 的代码生成功能创建组件、接口等
|
||
- 生成的代码必须符合项目规范
|
||
- 手动调整生成的代码，确保质量
|
||
|
||
### 2. 调试工具
|
||
- 使用 Trae 的调试功能排查问题
|
||
- 利用 Trae 的搜索功能快速定位代码
|
||
- 结合浏览器开发工具进行前端调试
|
||
|
||
## 最佳实践
|
||
|
||
1. **模块化开发**：将功能拆分为小的、可维护的模块
|
||
2. **代码复用**：提取公共组件和工具函数
|
||
3. **性能优化**：注意组件渲染性能，避免不必要的重渲染
|
||
4. **安全性**：注意处理用户输入，避免安全漏洞
|
||
5. **可访问性**：确保界面对所有用户可访问
|
||
|
||
## 检查清单
|
||
|
||
开发完成后，确保：
|
||
|
||
- [ ] 代码符合项目框架规范
|
||
- [ ] 功能正常工作
|
||
- [ ] 文档已同步更新
|
||
- [ ] 无 lint 和类型错误
|
||
- [ ] 代码风格一致
|
||
- [ ] 测试通过
|
||
|
||
遵循这些规则，使用 Trae 可以更高效、更规范地进行项目开发。 |