前言
随着前端技术的不断发展，前端已经不再是传统的展示型页面构建，而是在向着服务端的API接口服务开发越来越深入。这就需要前端开发人员具备一定的后端编程知识和技能。而随着前后端分离的逐渐成熟，我们经常需要与后端同步API接口的定义，以便前端能正确地调用后端提供的API。本文将介绍npm包@nll/api-codegen-ts的使用方法，以协助前端开发人员更加顺畅地进行API接口开发。
安装
在使用之前，我们需要先将 @nll/api-codegen-ts 安装到我们的项目中。安装方式有两种：
全局安装
在命令行中输入以下命令：
npm install -g @nll/api-codegen-ts
本地安装
在项目根目录下，打开命令行，输入以下命令：
npm install --save-dev @nll/api-codegen-ts
使用
生成客户端代码
@nll/api-codegen-ts 可以通过Swagger或OpenAPI API规范生成客户端代码。 我们可以通过运行以下命令来生成：
api-codegen-ts generate https://petstore.swagger.io/v2/swagger.json
其中https://petstore.swagger.io/v2/swagger.json是Swagger JSON API规范URL。生成的代码将被输出到当前目录下一个名为src/api的目录中。
生成的代码是基于TypeScript的，由以下部分组成：
-- -------------------- ---- -------
----
----
-----
-- -- --- --- --
-------
-- -------- --
--------
-- ----- --
------
-- ---- --
--------
-- ---- --使用生成的API
生成的代码包括了一系列远程API请求的封装，模型类定义，以及API使用的类型，你可以通过以下方式使用：
-- -------------------- ---- -------
-- ----------
------ - ---------- - ---- --------
-- -----
----- --- - --- -------------
-- ----
----- -------- ---------- -
--- -
----- -------- - ----- -------------- ------ -- ---
---------------------------
- ----- ------- -
---------------------
-
-代码生成器配置
如果我们不想使用默认配置，可以通过运行以下命令来生成一个基本的配置文件：
api-codegen-ts init
生成出的基本配置文件如下：
-- -------------------- ---- -------
-
-------- -
------- ------
-------- --
--
--------- -
------------ ----------
------------------ ---
----------------- -------
-------------------- ---
------------------- ---
---------------------- -----
--
---------- -
--------------------- -----
--------------- ------
---------------------- -----------
----------------------- -----
--------------------- -----
----------------- -----
---------------------------- ------
----------------- -----
---------------- -----
--------------------- -----
--------------------- ------
--------- ------
-------- ------
-------------------------- -----
-
-我们可以根据自己的需求修改配置文件，然后在运行时通过以下命令来指定配置文件：
api-codegen-ts generate -c my-config.json
示例代码
以PetStore API为例，以下是使用 @nll/api-codegen-ts 生成的代码：
-- -------------------- ---- -------
--- ------ ---
-- ------ --------
------ ----- -------- -
---- -------
------ -------
-
-- ------ ---
------ ----- --- -
---- -------
---------- ---------
----- -------
---------- --------------
------ -----------
-- -----
------------------ ------------- -
------------------- ------
-
-
-- ------ ---
------ ----- --- -
---- -------
------ -------
-
--- ---- ---
-- ---- ----------
------ ----- ---------- -
------- --------- -------
------- ------ --------------
-- -----
-------------------- ---------- -
------------- - ---------------- -- ---
---------- - ---------------------
-
-- ------
----- ---------------------- -------------------- --------- ------------------- --------------------------------- -
----- ---- - -----------------------
----- -------------- ------------------ - -
------- ------
---- -----
------- ----------- - -------------------------------------------- - ----------
------------- -------
------------------------
--
--- -
----- -------- - ----- ----------------------------------
------ -------------------------------------
- ----- ------- -
------ --------------------------
-
-
-- ----
----- --------------- ---- --------- ------------------- --------------------------------- -
----- ---- - -----------------------
----- -------------- ------------------ - -
------- -------
---- -----
-----
------------- -------
------------------------
--
--- -
----- -------- - ----- ----------------------------------
------ -------------------------------------
- ----- ------- -
------ --------------------------
-
-
-- ---------
----- ----------------- ------- --------- ------------------- --------------------------------- -
----- ---- - --------------------------------
----- -------------- ------------------ - -
------- ------
---- -----
------------- -------
------------------------
--
--- -
----- -------- - ----- ----------------------------------
------ -------------------------------------
- ----- ------- -
------ --------------------------
-
-
-- ----
----- --------------- ---- --------- ------------------- --------------------------------- -
----- ---- - -----------------------
----- -------------- ------------------ - -
------- ------
---- -----
-----
------------- -------
------------------------
--
--- -
----- -------- - ----- ----------------------------------
------ -------------------------------------
- ----- ------- -
------ --------------------------
-
-
-- ----
----- ---------------- ------- -------- ------- --------- ------------------- --------------------------------- -
----- ---- - --------------------------------
----- -------------- ------------------ - -
------- ---------
---- -----
-------- -
------- -------
---------------------------------
--
------------- -------
------------------------
--
--- -
----- -------- - ----- ----------------------------------
------ -------------------------------------
- ----- ------- -
------ --------------------------
-
-
-- ------
----- --------------------- ------- -------------------- ------- ------ ----- --------- ------------------- --------------------------------- -
----- ---- - --------------------------------------------
----- -------------- ------------------ - -
------- -------
---- -----
-------- -
--------- -------------------
---------------------------------
--
------- - ------------------- ------------------ -- -- --
----- -----
------------- -------
------------------------
--
--- -
----- -------- - ----- ----------------------------------
------ -------------------------------------
- ----- ------- -
------ --------------------------
-
-
-
-- ------ -- --------
-- ------- --------------------
-------- ---------------------------- - ----- -------- ------- --- --------------- -
----- ------------ - --- ------------------
--- ------ --- -- ------- -
-- ------------ --- ---------- -
--------------------- ---------------------
-
-
------ -------------
-
-- ------ -- --------
-- ------- -------------
-------- -------------------------- ------------------ -------------- -
----- ------- - -----------------
----- ------ - ----------------
----- ---- - --------------
------ - ----- -------- ------ --
-
-- ------ -- --------
-- ------- ------------------
-------- ------------------------- ------------ ---------------- -
-- ----------------------------------------------------------------
----- ------- - ------------------------
----- ------ - ---------------------- -- --
----- ---- - -------------------- -- ---
----- -------------- ---------------- - - ------ - -------- ------------- -- -------- ------ --
-- ------ -
--- -
---------------------------------- - ----- ---------------- ---
- ----- --- -
---------------------------------- - ---- ---
-
-
------ --------------
-
-- ------ -- --------
-- -----
------ ---- ----------- - -------------- ---------
------ --------- ------------------- -
------- -------
-
------ --------- --------- -
---------- -------
------------- -------------------
-
------ --------- ----------------- -
------------- -------------------
-
------ --------- -------------- -
----- --
-------- -------------- --------
------- -------
-
------ --------- ---------------- -
------ -
-------- -------
------ ----
--
-------- -------------- --------
------- -------
-结论
在本文中，我们介绍了 @nll/api-codegen-ts 这个npm包的使用方法，其可以自动生成前端以及后端API的客户端代码、模型定义等。通过这个npm包，我们可以大大提高我们的开发效率，并且可以减少一些模板式的代码编写。同时，这个生成代码也极大地简化了前端与后端之间的接口开发。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/600673e2fb81d47349e53d81