简介
service-layer-admin 是一个用于前端项目中管理后端服务层接口的npm包。它允许用户在前端界面中定义、测试和调用服务层接口，以及自动生成对应的代码文件。在前端开发过程中，能够大大提升开发效率，减少前后端的沟通成本，降低出错率。
安装
通过npm安装:
npm install service-layer-admin --save-dev
使用
初始化
在项目中新建一个 administration.js 文件，以下内容：
import { Administration } from 'service-layer-admin'
const administration = new Administration({
apiHost: 'http://localhost:8080',
mockHost: 'http://localhost:3000/dev-api', // 可选
})其中，apiHost为后端接口的地址，mockHost为mock接口的地址（可选）。
定义
以一个todo list模块的增删改查接口为例，将这些接口定义到一个todo-service.js文件中：
-- -------------------- ---- -------
------ - ------- - ---- ---------------------
------ ----- ----------- - --- ---------
----- -------------- -- ----
----- -
-
----- ----------
------- ------
---- -------------
----- -----------
--
-
----- ----------
------- -------
---- ------------
----- ---------
--
-
----- -------------
------- ---------
---- ---------------
----- ---------
--
-
----- -------------
------- ------
---- ---------------
----- ---------
--
--
--调用
将定义好的todo-service.js文件引入到administration.js中：
-- -------------------- ---- ------- ------ - -------------- - ---- --------------------- ------ - ----------- - ---- ---------------- ----- -------------- - --- ---------------- -------- ------------------------ --------- -------------------------------- -- -- -- -------------------------------------------
在前端界面中可以调用已经注册的service，例如：
const res = await administration.call('TodoService.getList', { page: 1, size: 10 })
console.log(res)自动生成代码
在 administration.js 中加入以下代码，即可自动生成对应的代码文件：
administration.generateCode({
output: './src/services',
servicePrefix: 'Api',
fileName: 'api.ts'
})其中，output为生成文件所在的目录，servicePrefix为生成服务名称的前缀（可选），fileName为生成文件的名称。
测试
在 administration.js 中加入以下代码，即可进入测试页面：
administration.startTestServer()
完整代码示例
以下是一个完整的代码示例：
todo-service.js
-- -------------------- ---- -------
------ - ------- - ---- ---------------------
------ ----- ----------- - --- ---------
----- --------------
----- -
-
----- ----------
------- ------
---- -------------
----- -----------
--
-
----- ----------
------- -------
---- ------------
----- ---------
--
-
----- -------------
------- ---------
---- ---------------
----- ---------
--
-
----- -------------
------- ------
---- ---------------
----- ---------
--
--
--administration.js
-- -------------------- ---- ------- ------ - -------------- - ---- --------------------- ------ - ----------- - ---- ---------------- ----- -------------- - --- ---------------- -------- ------------------------ --------- -------------------------------- -- ------------------------------------------- ----------------------------- ------- ----------------- -------------- ------ --------- -------- -- --------------------------------
结论
通过使用service-layer-admin包，我们可以更加方便地管理前后端接口，提升开发效率，减少沟通成本。同时，它的自动生成代码功能也能为我们省去繁琐的手工操作，降低出错率。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/600671d630d0927023822c27