介绍
在前后端分离的开发环境中，端与端之间的通信文档可以使用 Swagger 定义。以前端而言，在使用 axios 或 fetch 时需要手写请求和响应的参数，非常繁琐，这时便可以使用 swagger-es6 ，它能自动将 Swagger 文档转为 TypeScript 或 ES6 的模型、接口以方便应用。
安装
使用 npm 安装 swagger-es6：
npm install swagger-es6
使用步骤
获取 Swagger 平台的 OpenAPI（版本2.0）的 JSON 文件（文件名一般为 swagger.json 或 swagger.yaml）。
在项目中引入 swagger-es6：
import Swagger from 'swagger-es6';
将 Swagger 定义是转换成具体的 TypeScript 或 ES6 文件：
-- -------------------- ---- ------- ---- ------- - - ---- ------- -- ------- --- --- -- ---------- ------- -- ------ --------- ------- -- ---------- ------------ ------- -- -------- ----------- ------- -- -------- --------- -- ----- ------- ------- - - ---- --------------------------------------------- ---------- -------------- --------- ------------------------------ ------------ ------------------ ----------- --- -- -------------------------
以上代码就能自动生成 PetStoreAPI.js 文件，里面已经包含了 API 类和接口，使用方式就如下面的示例代码一样简单。
示例
以 Swagger 官网的 Petstore 应用为例：
-- -------------------- ---- ------- -- ------- ----------- - ------ ----------- ---- ---------------- -- -- --- ----- --- - --- -------------- ------------------------------ -- - ---------------------- ---
以上调用就是 invoke 服务端/listPets 接口。
至此，我们就成功的将 Swagger 的 API 文档转化为可用的 TypeScript 或 ES6 类，而相关的 HTTP 请求响应也得以转化为模型和接口，让前端集成与服务端对接的接口变得更加轻松。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/600671d130d09270238229bf