用 AI 把后端 Swagger 文档自动转成 TypeScript 类型 + 请求函数，手写接口层的时代结束了

每次后端给新接口前端要做三件事定义 TS 类型、写请求函数、写 mock 数据。一个接口 15 分钟10 个接口就是半天。我搭了一个工作流后端 Swagger JSON → AI 转换 → 直接生成可用的 service 文件。接口层从手工活变成自动化。以前的工作流后端出接口文档Swagger/飞书文档/口头描述 ↓ 前端手写 TypeScript 类型 ← 15min/接口 ↓ 前端写请求函数 ← 5min/接口 ↓ 发现类型和实际返回不一致 ← 联调时才知道 ↓ 改类型 ← 5min/接口 ↓ 总计25min/接口 × 10 4h现在的工作流后端出 Swagger 文档 ↓ 复制 JSON 给 AI或直接引用 swagger.json ↓ AI 生成 types service 文件 ← 2min/10 个接口 ↓ 检查 微调 ← 10min ↓ 总计12minvs 之前 4hPrompt 模板请根据以下 Swagger/OpenAPI 接口定义生成 TypeScript 代码 ## 生成要求 1. **类型定义**Request 和 Response 的 interface 2. **请求函数**使用 request 实例import from /api/axios 3. **命名规范** - 类型名大驼峰以 Params/Response 结尾 - 函数名小驼峰以 HTTP 方法开头get/post/put/delete 4. **注释**每个接口函数加中文注释说明用途 5. **导出**全部 named export ## 项目约定 - 请求实例import request from /api/axios - 响应包装接口返回 { code: number, data: T, msg: string }只需要定义 data 的类型 - 日期字段string 类型后端返回字符串 - 分页参数{ pageNum: number, pageSize: number } - 分页响应{ list: T[], total: number } ## Swagger JSON [粘贴接口定义]实际生成效果输入Swagger 片段{/api/store/list:{get:{summary:门店列表,parameters:[{name:storeName,in:query,type:string},{name:status,in:query,type:integer,enum:[0,1,2]},{name:pageNum,in:query,type:integer},{name:pageSize,in:query,type:integer}],responses:{200:{schema:{properties:{list:{type:array,items:{properties:{storeId:{type:integer},storeName:{type:string},status:{type:integer},address:{type:string},createTime:{type:string}}}},total:{type:integer}}}}}}}}AI 输出importrequestfrom/api/axios/** 门店状态枚举 */exportenumStoreStatus{/** 未启用 */Disabled0,/** 已启用 */Enabled1,/** 已关闭 */Closed2,}/** 门店列表查询参数 */exportinterfaceGetStoreListParams{storeName?:stringstatus?:StoreStatus pageNum:numberpageSize:number}/** 门店信息 */exportinterfaceStoreItem{storeId:numberstoreName:stringstatus:StoreStatus address:stringcreateTime:string}/** 门店列表响应 */exportinterfaceGetStoreListResponse{list:StoreItem[]total:number}/** 查询门店列表 */exportconstgetStoreList(params:GetStoreListParams)request.getGetStoreListResponse(/api/store/list,{params})处理复杂场景嵌套对象{orderInfo:{orderId:string,items:[{goodsId:number,goodsName:string,specs:[{specId:number}]}]}}AI 会自动拆分为多个 interfaceexportinterfaceOrderSpec{specId:number}exportinterfaceOrderItem{goodsId:numbergoodsName:stringspecs:OrderSpec[]}exportinterfaceOrderInfo{orderId:stringitems:OrderItem[]}可选字段推断AI 根据 Swagger 的required字段自动标记可选exportinterfaceUpdateStoreParams{storeId:number// requiredstoreName?:string// optionaladdress?:string// optional}enum 转 TypeScript 枚举当 Swagger 标注了enumdescriptionAI 会生成带注释的枚举。增量更新策略后端改了接口怎么办方案 1简单粗暴 ├── 把新 Swagger 丢给 AI ├── AI 重新生成整个文件 └── 用 diff 工具对比变化 方案 2精准更新 ├── 只把改动的接口丢给 AI ├── 帮我更新 getStoreList 的响应类型新增了 phone 字段 └── AI 只修改对应的 interface我们用方案 2因为方案 1 可能覆盖掉自己手动调整过的部分。和 Steering 配合在 steering 里声明项目的接口规范AI 生成时自动遵守## 接口层规范 - 文件位置src/services/{domain}/{feature}.ts - 请求实例import request from /api/axios - GET 请求参数放 paramsPOST 放 data - 响应类型泛型request.getResponseType(url, { params }) - 文件上传用 FormData multipart/form-data header - 枚举值用 enum不用 union type投入产出一次性投入 ├── 写 Prompt 模板30min ├── 配置 steering 约定20min └── 总计50min 每次使用节省 ├── 10 个接口从 4h → 12min ├── 按每周新增 5-8 个接口算 ├── 每周节省~2h ├── 每月节省~8h └── 3 个月~24h3 个工作日 你们前端的接口类型是手写的还是自动生成的有用过 swagger-typescript-api 之类的工具吗完整 Skills 源码已开源github.com/sleepyccat/ai-native-workflow欢迎 Star ⭐ 和 PR。