需要
每次接口定义实现之后都要手动申明Ts类型和申请函数
每次接口变更之后都得反复手动申明Ts类型和申请函数
于是就有了 @clean-js/api-gen
依据yapi,swagger2,swagger3自动生产申请函数和代码,开释生产力,让你有更多的工夫摸鱼
文档看这里
生成的代码Demo看这里
install
npm install @clean-js/api-gen
性能
- 依据YAPI,swagger2,swagger3等api协定主动生成申请代码
- 申明残缺的Typescript入参和出参类型
- YAPI会在正文中写入该接口的地址
办法命名规定为 method+url;如/user,method:post,生成的代码如下
/** Yapi link: https://yapi.onewo.com/project/2055/interface/api/125352 */export function postUser(parameter: { body: PostUserBody }) { return Req.request<ResponsePostUser>({ url: '/user', method: 'post', data: parameter.body, });}
config
interface
export interface Config { url: string; // http或者文件绝对路径 outDir?: string; // 输入文件门路,默认为./clean-js type?: "umi3" | "axios"; // 生成的代码类型,umi3是基于umi-request申请库, 默认为 axios}
新建clean.config.ts
export default { url: 'https://petstore3.swagger.io/api/v3/openapi.json', // swagger 3 url: 'https://petstore.swagger.io/v2/swagger.json', // swagger 2 url: 'http://yapi.smart-xwork.cn/api/open/plugin/export-full?type=json&pid=186904&status=all&token=59ecff7d43926c3be48f893deba401407f0d819c6c24a99b307a78c0877bc7d2' // yapi}
YAPI
- 我的项目->设置->生成 ts services
- 复制remoteUrl地址
- 在clean.config.ts文件中填入url地址
- 运行npm run api-gen
Swagger
- 复制swagger json在线地址,或者本地文件相对地址(绝对地址)
- 在clean.config.ts文件中填入url地址
- 运行npm run api-gen
运行时
在代码运行时设置申请实例
import { Req } from '@/clean-js/http.service';function initCleanJsApi() { Req.set(request);}
贴上源码 @clean-js/api-gen
期待宝子们的star⭐️,你的反对就是我最大的能源