通过调用 RESTful API 接口，可以方便地在前端应用中获取数据。然而，在开发过程中，如何为接口文档生成相应的代码成为了一个问题。gobhash-swagger 提供了一个解决方案，通过读取 swagger.json 文件，它可以为您的接口生成 Typescript 类型定义和请求代码，以及 Angular 服务。
安装 gobhash-swagger
在终端中切换到已经一步的项目文件夹，然后运行以下命令，安装 gobhash-swagger 依赖：
npm install --save-dev gobhash-swagger
创建配置文件
首先，您需要在您的项目根目录中创建一个名为 gobhash-swagger.json 的文件，文件格式如下：
-- -------------------- ---- -------
-
--------- -
------------ ---------------
--
---------- -
------ -----------------------------------
--
------------ -
---------- -
------- ------------------------------------------------------
------------ -----------------
-
-
-输出目录指定生成代码的目录位置, swagger.url 是 RESTful API 接口文档地址，className 是服务类的名称。
配置 npm scripts
在 package.json 中添加以下 npm script：
{
"scripts": {
"generate-api": "gobhash-swagger generate"
}
}运行此脚本将生成接口定义和请求代码。
生成代码
在终端输入以下命令即可生成代码：
npm run generate-api
这会生成一个 ApiModule，在这个模块中引入了所有服务，这样您就可以在应用中轻松使用它们。
-- -------------------- ---- -------
------ - -------- - ---- ----------------
------ - ----------- - ---- -----------------
-----------
---------- -
-----------
-
--
------ ----- --------- - -使用服务
这是一个例子，演示如何从生成的服务中进行请求。
-- -------------------- ---- -------
------ - --------- - ---- ----------------
------ - ----------- - ---- ---------------------
------------
--------- -
----
--- ----------- ---- -- -------
-- --------- --
-----
-----
-
--
------ ----- -------------- -
------ ------
------------------- ------------ ------------ - -
---------- -
-------------------------------------------- -- -
---------- - ------
---
-
-此代码将调用用户服务中的 listUsers 方法，然后使用订阅者来设置本地 users 数组。
总结
在本教程中，我们介绍了如何使用 gobhash-swagger 生成 Typescript 类型定义和请求代码，以及如何在 Angular 应用程序中使用生成的服务。使用 gobhash-swagger 可以帮助您更容易的处理接口文档，提高前端开发效率和代码质量。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6005643181e8991b448e15ce