1. 安裝插件

pnpm add @umijs/max-plugin-openapi
pnpm add swagger-ui-dist

如果不安裝swagger-ui-dist，不會影響運行。但會報錯。

2.配置文件

 export default defineConfig({// umi插件配置plugins: ['@umijs/max-plugin-openapi'],// openAPI配置openAPI: {requestLibPath: "import { request } from '@umijs/max';",mock: false,schemaPath: path.resolve(__dirname, 'swagger.json'),},

3.關于

注意sagger.json是本地生成的關于api的json。

可以使用apifox編輯好接口后，直接生成。

格式類似

{"info": {"title": "q","description": "","version": "1.0.0"},"tags": [{"name": "組卷管理"}],"paths": {"/papers/search": {"get": {"summary": "根據條件查詢已有組卷","deprecated": false,"description": "查詢已有組卷","operationId": "searchPapers","tags": ["組卷管理"],"parameters": [{"name": "paper","in": "query","description": "組卷名稱","required": false,"type": "string"},{"name": "grade","in": "query","description": "年級","required": false,"type": "string"},{"name": "subject","in": "query","description": "學科","required": false,"type": "string"}],"responses": {"200": {"description": "查詢成功","headers": {},"schema": {"type": "array","items": {"$ref": "#/definitions/Paper"}}},"400": {"description": "參數錯誤","headers": {},"schema": {"$ref": "#/definitions/ErrorResponse"}},"500": {"description": "服務器內部錯誤","headers": {},"schema": {"$ref": "#/definitions/ErrorResponse"}}},"security": [],"produces": ["application/json"]}}},"security": [],"swagger": "2.0","definitions": {"Paper": {"type": "object","properties": {"id": {"type": "integer","format": "int64","description": "組卷ID"},"name": {"type": "string","description": "組卷名稱"},"status": {"type": "integer","description": "組卷狀態：0-正在組卷，1-已完成組卷"}},"required": ["id","name","status"]},"ErrorResponse": {"type": "object","properties": {"code": {"type": "integer","format": "int32"},"message": {"type": "string"}},"required": ["code","message"]}},"securityDefinitions": {},"x-components": {}
}

4. 修改package 【重要】

一定看這里，在package.json里加上name與version。不然會一直報錯，無法運行。

 {"name": "name","version": "0.0.1",..."scripts": {..."openapi": "max openapi"},"dependencies": {...},"devDependencies": {...}}

5.運行

pnpm openapi

應該會servers目錄生成pageage.json中填寫的name值目錄且生成相關文件。

關于swagger-ui

前面如安裝了swagger-ui-dist,那就可以在運行pnpm start，可訪問/umi/plugin/openapi查看接口。個人感覺如何使用apifox等工具后，查看不查看的沒有什么用。