---
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 可以更高效、更规范地进行项目开发。