%20(2).svg)
项目简介
本项目是基于 @umijs 微内核开发的插件，专注于约定式 API 接口配置的编译时转换。它为 umijs 赋予接口转换能力，开发者无需反复手写 service spi 函数，插件会自动把接口配置转换为对应的 Promise<R> 函数，开发者从 plugin 或 umi 中引用即可发起接口请求。该插件在编译时操作，相比运行时处理接口承诺，减少了多余开销，还能借助 umijs 脚手架的微内核能力实现可拔插、剔除打包依赖。
项目的主要特性和功能
- 接口自动转换：自动将约定的接口配置转换为
Promise<R>函数，便于开发者进行接口请求。 - 性能优化：编译时处理接口请求，降低运行时处理开销，提升项目性能。
- 易于集成与使用：简单安装和配置即可集成到项目中，使用方式简洁。
- 可扩展性与可定制性：基于
umijs微内核架构，具备可扩展和可定制能力，满足不同项目需求。
安装使用步骤
安装插件
通过包管理工具将当前插件安装到运行时依赖，安装后可在 package.json 的 devDependencies 中查看版本依赖。
```shell
yarn add plugin-transform-api -D
npm install plugin-transform-api -D ```
添加插件
根据开发配置引入插件，一般在 .umirc.ts 或者 config/* 下配置注入功能。参考配置如下：
typescript
export default defineConfig({
plugins: ['plugin-transform-api'],
nodeModulesTransform: {
type: 'none',
},
routes: [{ path: '/', component: '@/pages/index' }],
fastRefresh: {},
interface: {
path: 'services',
requestPath: '@/utils/request',
},
});
插件在开发时会监听对应文件夹下的文件，生成最新的 函数接口。
添加配置
可使用 JSON 格式文件或 JS & TS 文件添加接口配置。
JSON 格式文件
json
{
"getUserInfo": "POST /mall-port/user/info",
"login": "POST /mall-port/user/login",
"deleteUser": "POST /mall-port/user/:id"
}
JS & TS 文件
javascript
module.exports = {
getUserInfo: "POST /mall-port/user/info",
"login": "POST /mall-port/user/login",
"deleteUser": "POST /mall-port/user/:id"
}
使用上述两种方式会在 .umi/plugin-interface 下生成新的插件函数，默认以 export 方式配置，并将其内容导入到 umi 的导出项内。
引用接口函数
有基于 TypeScript 的接口函数后，可通过以下两种方式引入：
typescript
import { deleteUser } from 'umi'
deleteUser().then()
typescript
import { deleteUser } from '@@/plugin-interface/api'
deleteUser().then()
TypeScript 支持
默认接口函数为 TypeScript 格式，支持 T, O, R 三个泛型推导函数：
- T：传入 payload 的类型，即接口函数所需类型。
- O：接口内置的 config 设置，可自定义 method, header 等。
- R：Promise 的返回值，通常为 response，数据格式为后端接口请求的响应。
若使用 Typescript 并启用严格类型模式，需确保类型声明推导合理。
下载地址
点击下载 【提取码: 4003】【解压密码: www.makuang.net】