- openapi-v3-request-generator 是一款基于openAPI v3的自动请求文件生成插件。 - 使用简单 且能实现高度自定义配置 - onGenRequestFnHook 实现自定义请求方法生成 勾子函数
npm install openapi-v3-request-generatorbash
npm install openapi-v3-request-generator --dev
`
或者
`bash
yarn add openapi-v3-request-generator --dev
`$3
> 在 package.json 文件script中新增 "gen": "openv3gen" 命令
`json
// package.json
{
"script": {
"gen": "openv3gen",
}
}
`##### 1.1 openapi.config.json5 配置说明
> 当项目根目录没有配置文件时 运行
yarn gen 或者 npm gen 脚本会自动在项目根目录中创建配置文件,无需手动创建
`ts
/*本文件为JSON5格式 安装json5 syntax vscode插件即可高亮展示 /
{
/* 生成模式 true:生成ts文件 false:生成js文件 默认值为true /
"tsMode": true,
/* 生成物存储目标文件夹 /
"targetDir": "./api",
/* axios 实例文件地址 可选,默认值 "@/plugins/axios" 即 import http from '@/plugins/axios' /
"requestLibPath": "@/plugins/axios",
/* api-docs 可多个文档地址 /
"projects": [
{
/* axios 实例文件地址 优先级高于父级配置 可选 /
"requestLibPath": "@/plugins/axios",
/* api-docs 文档地址 /
"url": "https:/api.yourserver.com/api/v3/api-docs",
/* 项目文件夹二级目录 /api/beam-server2 /
"projectName": "beam-server",
/* API请求地址前缀 可选 默认值为空/
"apiRequestUrlPrefix": "/beam-server"
},
]
}
`##### 1.2 独立请求类型及响应类型声明使用示例
`ts
import { login } from '@/server-api/user'
import type { TloginBodyRequest, TloginPathRequest, TloginQueryRequest, TloginResponse } from '@/server-api/user.types'const model: {
data: TloginBodyRequest
paths: TloginPathRequest
query: TloginQueryRequest
} = {
data: [],
path: [],
query: [],
}
const result: TloginResponse = {
data: []
}
TemplateFileCopy(model).then((res) => {
result.data = res
})
`$3
##### 2.1 自定义生成请求钩子函数使用
`ts
import ApiBuilder from 'openapi-v3-request-generator'new ApiBuilder({
url: 'https://api.xxx.com/api/v3/api-docs',
projectName: 'beam-server',
targetDir: './src/server',
onGenRequestFnHook: (config) => {
let reqParams = 'params: {'
if (config.paramsList.body.num) {
reqParams +=
}
if (config.paramsList.path.num) {
reqParams +=
}
if (config.paramsList.query.num) {
reqParams +=
}
if (config.paramsList.body.num || config.paramsList.path.num || config.paramsList.query.num) {
reqParams += '}'
} else {
reqParams = ''
} let pathVarables = ''
let requestPath = ''
if (config.paramsList.path.num > 0) {
requestPath = config.path.replace(/\{/g, '${')
// 匹配出地址栏的参数 例:/gitlab/projects/{gitlabProjectId}/files/{ref}/
const regex = /{(.*?)}/g;
const matches = config.path.match(regex)?.map(function(match) {
return match.replace(/[{}]/g, '')
})
if (matches?.length) {
pathVarables =
const { ${matches.join(',')} } = params?.paths || {}
}
} return
}
})
`##### 2.2 自定义生成请求文件名称钩子函数使用 onGenRequestFileNameHook
`ts
import ApiBuilder from 'openapi-v3-request-generator'
new ApiBuilder({
url: 'https://api.xxx.com/api/v3/api-docs',
projectName: 'beam-server',
targetDir: './src/server',
onGenRequestFileNameHook: (tag) => {
return tag + 1234
}
})
`
$3
- 修复正则判断文件名是否包含特色字符提示错误
- 新增TS模式下生成的请求参数与返回参数 独立的类型声明文件
- 调整单个请求参数类型 不再使用对象传递参数
- 调整js模式下单个请求参数类型 不再使用对象传递参数
- 新增 操作模块名称中文转拼音功能#### v2.0.3
- 新增文件对比功能,自动对比文件差异,并生成差异文件
- / @ts-ignore / 头注释,避免ts报错影响打包
#### v2.0.4
- 根据 export 字符 判断是否有导出 无则不生成类型声明文件
$3
- 调整生成文件名称为kebab-case,防止操作系统文件名称大小写不敏感问题$3
- 新增 include 配置项,用于指定只生成指定路径的接口
- 新增 exclude 配置项,用于指定排除指定路径的接口$3
- 新增 多项目检测功能、如果有多个交互式命令行可选择要生成请求文件的服务
- 去除 去除生成请求函数中的时间头文件注释$3
- 新增请求函数名称生成模式
`js
/*本文件为JSON5格式 安装json5 syntax vscode插件即可高亮展示 /
{
/* 生成模式 true:生成ts文件 false:生成js文件 可选配置 默认值为true /
"tsMode": true,
/* 生成物存储目标文件夹 /
"targetDir": "./api",
"requestFunctionNameMode": "path", // path / operationId 默认值 operationId
}
``