目标

AI 是你的研发助理，你是架构 / 规则 / 校验的负责人。把你的工作流拆成环节，每个环节都用上 Agent 能力，同时建立约束和校验闭环

rules

规则文件是 markdown，自带 frontmatter：
1.右上角齿轮 → 设置 → 规则与记忆；
2. 规则区域点 + 创建 → 项目；
3. 名称填 global，确认；
4. TRAE 自动在项目根生成：.trae/rules/global.md；
5. 编辑这个文件内容（我这里只是常规规则内容，可以根据自己的需求调整）：

---
description: 项目全局基础约束
alwaysApply: true
---
Node版本约束：
本项目固定使用 node 22.16.0，项目根存在 .nvmrc 文件。
✅ **你在执行任何终端shell命令之前，必须先执行 nvm use 切换版本，确认版本为22.16.0之后，再执行后续命令**
如果 nvm use 报错，先输出提示，不要继续执行安装、启动等命令。

开发流程（所有技术栈统一遵守）：
1. 收到需求，先输出方案、变更文件清单，不要直接写代码
2. 改动遵循最小变更，不随意重构无关代码
3. 所有接口入参、返回值必须写TS类型
4. 代码写完，主动提示边界风险、潜在bug
5. 输出干净代码，不要冗余注释，关键逻辑简单注释

规则说明：
不同目录有独立技术栈规则，当你读写对应目录的文件时，自动加载对应技术栈规范，禁止跨栈混用规范。

6. node-version:

---
description: Node版本强制校验
globs: .nvmrc, package.json, pnpm-lock.yaml
alwaysApply: false
---
⚠️ 重要：本环境是Windows + nvm-windows，Trae内置终端无法执行nvm use命令，会弹窗报错。
约束：
1. 项目固定node版本：22.16.0，.nvmrc内容为22.16.0
2. 所有pnpm/node相关命令执行前，**先校验 node -v**
3. 如果版本不是22.16.0，停止执行，提示我：【请在外部PowerShell手动执行 nvm use 22.16.0，再回来继续】
4. 禁止你在Trae终端调用 nvm / nvm use 命令！

7. vue3-web

---
description: Vue3 Web组件规范
globs: src/views/**/*.vue, src/components/**/*.vue
alwaysApply: false
---
技术栈：Vue3 + <script setup lang="ts"> + Vite + UnoCSS + Pinia
约束：
1. 组件统一使用 defineProps / defineEmits，props默认值用withDefaults
2. style scoped，优先UnoCSS，不要写冗余class
3. 接口请求统一 @/api，组件内禁止直接写fetch/axios
4. 组件中禁止直接发起网络请求，所有请求调用 src/api 导出的函数，遵循 @axios-api 规范

8. axios-api

---
description: Axios 请求封装、接口、TS类型规范
globs: src/api/**/*.ts, src/utils/request.ts, src/**/*.ts
alwaysApply: false
---
## 技术约定
基于 axios 封装全局请求实例，不直接在业务组件 import axios 发起请求。
请求入口统一：`@/utils/request`

## 约束清单
1. 禁止在 .vue 组件内直接写 axios、fetch、XMLHttpRequest。所有网络请求必须调用 src/api 下已经封装好的接口函数。
2. 接口文件按业务模块拆分，放在 src/api/xxx.ts；每个接口必须同时导出入参类型、返回值类型。
3. 接口函数命名规范：`getXxx` / `createXxx` / `updateXxx` / `deleteXxx`，动词开头。
4. 统一使用封装好的 request 实例，不要新建多个 axios.create 实例。
5. 全局拦截器统一处理：token 注入、401 登录失效跳转、统一错误提示、响应解包。
6. 后端返回统一包装结构：{ code: number, data: T, msg: string }，在拦截器里处理，业务层直接拿到 data。
7. 超时配置、baseURL、请求头只在 request.ts 一处维护，业务代码不要覆盖 baseURL。
8. 分页接口类型统一封装通用 Page<T>，不要重复写分页结构。
9. 上传文件使用 FormData，单独封装 upload 函数，带上请求头标识。
10. 新增接口时，优先补充 TS 类型；缺少类型就先定义 interface / type，再写接口函数。
11. 不需要 try catch 在每一个接口调用处；全局拦截器统一捕获错误，业务层按需 catch 处理特殊业务异常。
12. 不要硬编码接口地址，全部放在 request 或者 api 模块。

## 示例模板（给AI参考，不要直接到处复制）
```typescript
import request from '@/utils/request'

export interface DeviceListParams {
 page: number
 pageSize: number
 keyword?: string
}

export interface DeviceItem {
 id: string
 name: string
}

export function getDeviceList(params: DeviceListParams) {
 return request<{ list: DeviceItem[]; total: number }>({
   url: '/api/device/list',
   method: 'GET',
   params
 })
}

构建代码索引

根目录 .nvmrc

用于锁定项目版本内容就是node的版本号：22.16.0

skills

ai-code-verify-loop

SKILL.md

---
name: ai-code-verify-loop
description: AI生成TS代码 → 自动校验(tsc+eslint+vitest) → 人工评审 → 回归测试闭环，用于TypeScript代码质量校验流水线
---

# AI代码校验闭环技能
## 使用时机
用户需要生成TypeScript函数并附带单元测试、需要执行自动化校验、回归测试时，触发本技能。
不要用于普通代码问答、文档编写。

## 目录约定
- work/：临时代码存放目录，每次生成覆盖
- regression/：回归用例永久目录，评审pass后存入
- 工作区根目录为 ai-verify-loop

## 执行流程（严格按顺序，禁止跳步）
### Step1：需求收集与生成
1. 收集用户需求、用例英文名（如 sumArray）
2. 生成 TypeScript 函数代码 + 配套 vitest 单元测试
3. 约束：必须处理空值、undefined、边界；禁止编造不存在API；输出拆成 CODE / TEST 两段
4. 写入文件：work/index.ts、work/index.test.ts

### Step2：自动校验（调用终端工具，依次执行）
依次执行三条命令，捕获全部输出：
1. `npx tsc --noEmit work/index.ts`
2. `npx eslint work/index.ts`
3. `npx vitest run work/index.test.ts --reporter verbose`

收集全部结果，组装校验报告：
【TSC 结果】
xxx
【ESLint 结果】
xxx
【Vitest 单测结果】
xxx
判断：任意一条报错 = 自动校验失败

- ✅ 校验失败：把完整报错原文交给用户，告知：自动校验不通过，将把报错信息追加到上下文，重新生成代码；回到Step1重试
- ✅ 校验成功：输出完整校验报告，进入人工评审阶段

### Step3：人工评审（对话交互）
向用户提问：
> 自动校验全部通过，请评审：输入 pass 通过 / reject:【你的评审意见】

分支规则：
1. 用户回复 `pass`：评审通过
2. 用户回复 `reject: xxxx`：评审驳回，把评审意见追加到prompt，回到Step1重新生成

### Step4：评审通过 → 存入回归池
读取 work/index.ts、work/index.test.ts，写入：
`regression/{caseName}.ts` 和 `regression/{caseName}.test.ts`

### Step5：执行全量回归测试
执行命令：`npx vitest run regression/`
- 全部通过：输出 ✅ 回归测试全部通过，本轮闭环完成
- 存在失败：输出 ❌ 回归失败，列出失败用例，提示本次改动破坏历史逻辑

## 约束规则（必须遵守）
1. 不要擅自修改 regression 内已经归档的历史用例，只能新增
2. 校验命令必须完整执行，不能跳过 tsc / eslint
3. 输出报告结构化，不要省略报错堆栈
4. 回归失败时，禁止静默忽略，必须明确告知用户
5. 所有文件读写操作限定在当前项目目录，不访问外部路径

创建智能体

1、创建智能体

开始

TRAE对话框：
当前是空项目，使用 vite 创建 vue3 + ts 项目，使用 pnpm，集成 unocss、pinia。

创建完成后，安装依赖，执行 pnpm dev 启动。遵循本项目全部 .trae/rules 规则。

编码

1、对话框切换Agent @ts-code-verify-agent
2、 /panl 先列计划，由自己审核通过后再执行。
3、AI 生成 → 自动校验 → 人工评审 → 回归测试。