根据swagger json 自动生成 service &&types 文件

Generate typescript codes once user visit online swagger(2.x) docs.

最近新写了一个工具,根据swagger 自动生成service 和types 文件,提高coding 效率
(可以自定义配置只生成 types 文件)

Step1 yarn add swagger-tscode-generate

Step2 Add settings in webpack or custom node server.

swagger-tscode-generate support swagger json url or swagger json file ;

// ts-code-gen.js
  const  settingParams = [
  {
    // swagger json data or url
    // swagger:swaggerJson,
    url:'https://petstore.swagger.io/v2/swagger.json',
    codegen:{
       // generated Folders
    tsType:'src/codegen/types',
    tsControler: 'src/codegen/service',
  
  
    // Custom Request Tool
    httpBase:'~/utils/fetch',
  
     // rename file name more friendly
     // Sample --> SampleController
    getAPIFileName:  function transformFileName(name){
      return name.indexOf('API')?  `${name.replace(/[ ]/g,'')}Controller`:name;
    },
  
    // is only Create types file 
    onlyCreateTypes:true,
    }
  }

 ]

Step3 Visit Swagger Online Docs

  • set setting url https://petstore.swagger.io/v2/swagger.json
  • node ts-code-gen

3.2. View codes generated in folder src/codegen/service

my-app
├── config-override.js
├── node_modules
├── public
│   ├ index.html
│   └── favicon.ico
├── utils
│   └── fetch.ts
└── src
    ├── pages
    ├── components
    └── codegen
        └── service
            ├── commonType.ts
            └── business
                ├── ts
                │   └── SampleController.ts
                └── types
                    └── IMenuBo.ts
// src/codegen/service/business/ts/SampleController.ts

import { Response } from '../commonType';
import { IMenuBo } from '../types/IMenuBo';

import http from '~/utils/fetch';

/**
 * Delete Sample
 */
export const deleteSample = function(
  {
      id: number,
  },
  params?: {
    sample?: object;
  },
  config?: { [key: string]: any }
): Promise<Response<string>> {
  return http(`/sample/${id}`, {
    method: 'GET',
    params,
    ...config,
  });
};

/**
 * Get User Menu Permissions
 */
export const getMenu = function(config?: { [key: string]: any }): Promise<Response<Array<IMenuBo>>> {
  return http(`/menus`, {
     method: 'GET',
    ...config,
  });
};

// src/codegen/service/business/types/IMenuBo.ts

export interface IMenuBo {
  code?: string;

  title?: string;

  name?: string;
}

Options

options is type of Array<Settings>.

SettingsParams attributes as below:

  • url: string, Swagger Online Json Docs

  • codegen: CodeGen params for code generation.

  • prettyCmd: Optional pretty code command executed after code generate finished.

  • swaggerSavePath: Optional file path if you want to save original swagger difinitions content.

CodeGen attributes as below:

  • tsType: string folder for generated typescript type definitions.

  • tsControler: string folder for generated typescript api codes.

  • httpBase: string Promise based HTTP client. for example: axios.

  • responseWrapperPath: Optional string, custom response wrapper file path

  • responseWrapperName: Optional string, exported name from custom response wrapper file path

  • transformFileName: Optional function, transform file name more friendly.

  • onlyCreateTypes: Optional boolean ,

  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值