前端根据@umijs/openapi+swagger生成接口方法 补充

前端根据@umijs/openapi+swagger生成接口方法

之前为了节省项目Api导入 采用Umijs/openApi+swagger 自动解析swagger文档生成对应的Api访问代码 最近看代码发现上一个文章 这个问题的解决办法可自定义 request

openapi.config.ts 文件

ts 复制代码
import { generateService } from '@umijs/openapi';
generateService({
	schemaPath: 'xxx', // 可以是.json文件,也可以是远程json地址
	serversPath: './src/servers/java',
	requestLibPath: '@/common/utils/request', //自定义request 
});

@umijs/openapi 下 index.d.ts 文件

ts 复制代码
export declare const generateService: ({ requestLibPath, schemaPath, mockFolder, nullable, requestOptionsType, ...rest }: GenerateServiceProps) => Promise<void>;

@umijs/openapi 下 index.js 文件

js 复制代码
const getImportStatement = (requestLibPath) => {
    if (requestLibPath && requestLibPath.startsWith('import')) {
        return requestLibPath;
    }
    if (requestLibPath) { //请求库路径 
        return `import request from '${requestLibPath}'`;
    }
    return `import { request } from "umi"`; //默认选项
};

自定义Hook

ts 复制代码
import type { OpenAPIObject, OperationObject, SchemaObject } from 'openapi3-ts';
export declare type GenerateServiceProps = {
    requestLibPath?: string;
    requestOptionsType?: string;
    requestImportStatement?: string;
    /**
     * api 的前缀
     */
    apiPrefix?: string | ((params: {
        path: string;
        method: string;
        namespace: string;
        functionName: string;
        autoExclude?: boolean;
    }) => string);
    /**
     * 生成的文件夹的路径
     */
    serversPath?: string;
    /**
     * Swagger 2.0 或 OpenAPI 3.0 的地址
     */
    schemaPath?: string;
    /**
     * 项目名称
     */
    projectName?: string;
    hook?: {
        /** change open api data after constructor */
        afterOpenApiDataInited?: (openAPIData: OpenAPIObject) => OpenAPIObject;
        /** 自定义函数名称 */
        customFunctionName?: (data: OperationObject) => string;
        /** 自定义类型名称 */
        customTypeName?: (data: OperationObject) => string;
        /** 自定义 options 默认值 */
        customOptionsDefaultValue?: (data: OperationObject) => Record<string, any> | undefined;
        /** 自定义类名 */
        customClassName?: (tagName: string) => string;
        /**
         * 自定义获取type hook
         * 返回非字符串将使用默认方法获取type
         * @example set number to string
         * function customType(schemaObject,namespace){
         *  if(schemaObject.type==='number' && !schemaObject.format){
         *    return 'BigDecimalString';
         *  }
         * }
         */
        customType?: (schemaObject: SchemaObject | undefined, namespace: string, originGetType: (schemaObject: SchemaObject | undefined, namespace: string) => string) => string;
        /**
         * 自定义生成文件名,可返回多个,表示生成多个文件
         * 返回为空,则使用默认的获取方法获取
         * @example  使用operationId生成文件名
         * function customFileNames(operationObject,apiPath){
         *   const operationId=operationObject.operationId;
         *   if (!operationId) {
         *      console.warn('[Warning] no operationId', apiPath);
         *      return;
         *    }
         *    const res = operationId.split('_');
         *    if (res.length > 1) {
         *      res.shift();
         *      if (res.length > 2) {
         *        console.warn('[Warning]  operationId has more than 2 part', apiPath);
         *      }
         *      return [res.join('_')];
         *    } else {
         *      const controllerName = (res || [])[0];
         *      if (controllerName) {
         *        return [controllerName];
         *      }
         *      return;
         *    }
         * }
         */
        customFileNames?: (operationObject: OperationObject, apiPath: string, _apiMethod: string) => string[];
    };
    namespace?: string;
    /**
     * 默认为false,true时使用null代替可选
     */
    nullable?: boolean;
    mockFolder?: string;
    /**
     * 模板文件的文件路径
     */
    templatesFolder?: string;
    /**
     * 枚举样式
     */
    enumStyle?: 'string-literal' | 'enum';
    /**
     * response中数据字段
     * example: ['result', 'res']
     */
    dataFields?: string[];
    /**
     * 模板文件、请求函数采用小驼峰命名
     */
    isCamelCase?: boolean;
};
export declare const getSchema: (schemaPath: string) => Promise<any>;
export declare const generateService: ({ requestLibPath, schemaPath, mockFolder, nullable, requestOptionsType, ...rest }: GenerateServiceProps) => Promise<void>;
相关推荐
冴羽2 分钟前
能让 GitHub 删除泄露的苹果源码还有 8000 多个相关仓库的 DMCA 是什么?
前端·javascript·react.js
悟能不能悟4 分钟前
jsp怎么拿到url参数
java·前端·javascript
程序猿小蒜19 分钟前
基于SpringBoot的企业资产管理系统开发与设计
java·前端·spring boot·后端·spring
Mapmost21 分钟前
零代码+三维仿真!实现自然灾害的可视化模拟与精准预警
前端
程序猿_极客28 分钟前
JavaScript 的 Web APIs 入门到实战全总结(day7):从数据处理到交互落地的全链路实战(附实战案例代码)
开发语言·前端·javascript·交互·web apis 入门到实战
suzumiyahr30 分钟前
用awesome-digital-human-live2d创建属于自己的数字人
前端·人工智能·后端
萧曵 丶43 分钟前
Python 字符串、列表、元组、字典、集合常用函数
开发语言·前端·python
申阳1 小时前
Day 10:08. 基于Nuxt开发博客项目-关于我页面开发
前端·后端·程序员
拉不动的猪1 小时前
Webpack 与 Rollup 中 Tree-shaking 的实现原理与效果
前端·webpack·rollup.js
林太白1 小时前
跟着TRAE SOLO学习两大搜索
前端·算法