@xm-fe/create-api

⚡️ 简介

鲜沐科技 前端API生成工具

📌使用前须知

1. 需要安装 Apifox 客户端
2. 生成的所有的文件请勿手动修改，所有的改动请让后端修改文档后前端再重新导入
3. 该工具生成的同名文件会覆盖
4. 如果接口需要加前缀，比如 summerfarm-manage 请让后端在接口文档上直接生成（不是后端手动改文档）

❗❗❗因为所有的流程都是工具生成， 前后端对接口文档的操作请勿手动修改，以免后来的同学覆盖了原来手动修改的接口

🔧使用步骤

1. 安装

npm i @xm-fe/create-api -g

运行capi命令时，会读取当前项目根目下的的 capi.config.js文件，该文件中的配置会覆盖默认配置文件。

capi.config.js 具体配置及解释看文末

2. 配置

在项目根目录下新建 capi.config.js 文件

使用方式

运行命令后，生成的请求文件会生成到 apix/项目projectId对应的文件名/接口名 下

使用方式一 (推荐)

capi http://127.0.0.1:4523/export/openapi/5?version=3.0

直接使用导出的地址，无需再拼写 projectId

备注：此方法不适用于 全部导出，如需全部导出请使用 方式二 或 三

使用方式二

capi http://127.0.0.1:4523/export/openapi/9?version=3.0 954456

命令组成：capi apifox导出的URL projectId

使用方式三

capi

读取项目根目录配置文件 capi.config 中的 remotePath

默认项目配置

{
  954456: 'SAAS',
  1164722: 'summerfarm-manage',
  1164725: 'pms-service',
  1295278: 'summerfarm-crm',
  1409074: 'tms',
  1965722: 'summerfarm-wms',
  2020406: 'OFC',
  2437205: 'saas-manage',
  2437206: 'saas-oms',
  2437207: 'saas-mall',
  2517920: 'summerfarm-wnc',
  2546551: 'saas-pms',
  2546569: 'SCP',
  2546585: 'SRM',
  2546600: 'bms-service',
  2737704: 'summerfarm-mall'
}

缺少的项目 请联系我加进去 禁止私自手动修改文件名

⚙️capi.config.js 配置，分为 javascript 和 typescript 两个版本

javascript项目中使用

module.exports = {
  remotePath: `http://127.0.0.1:4523/export/openapi/4?version=3.0&projectId=xxxx`,
  language: 'js',
  // 插入的模板代码
  getApiCodeTpl(api) {
    const pathParams = api.pathParams
      .map((param) => `${param.name},`)
      .join('\r\n')
    return `
import net from '@/libs/net'
/**
  * ${api.summary}
  */
export function ${api.fileName || api.name}(
  ${pathParams ? pathParams : ''}
  ${api.queryParams ? `params,` : ''}
  ${api.bodyParams ? `data,` : ''}
) {
  return net(
    {
      url: \`${api.url}\`,
      method: '${api.method}',
      ${api.queryParams ? `params,` : ''}
      ${api.bodyParams ? ` data` : ''}
    }
  )
}`
  }
}

typescript项目中使用

module.exports = {
  remotePath: `http://127.0.0.1:4523/export/openapi/4?version=3.0&projectId=xxxx`,
  language: 'ts', // 生成的语言的使用方式 默认 'ts', 可选值：'js' | 'ts'
  // 插入的模板代码
  getApiCodeTpl(api) {
    const pathParams = api.pathParams
      .map((param) => `${param.name}${param.required ? '' : '?'}: ${param._type},`)
      .join('\r\n')
    return `
  import net from '@/utils/net'
  import { NetConfig } from '@/interface/IAxiosConfig'
  /**
   * ${api.summary}
   */
export function ${api.fileName || api.name}(
    ${pathParams ? pathParams : ''}
    ${api.queryParams ? `params?: ${api.queryParams._name},` : ''}
    ${api.bodyParams ? `data?: ${api.bodyParams._name},` : ''}
    config?: NetConfig
  ): Promise<${api.resType}> {
    return net(
      {
        url: \`${api.url}\`,
        method: '${api.method}',
        ${api.isDownload ? `_download: true,` : ''}
        ${api.queryParams ? `params,` : ''}
        ${api.bodyParams ? ` data,` : ''}
      },
      config
    )
  }
  `
  }
}

版本

1.0.2

• 修复二维数组生成问题[[''], ['', '', '']]

0.0.5

• 支持js版本
• 优化体验

0.0.1

• 初始化

🚀 开发

# 安装依赖
npm i

# 发布流程

# 编译
npm run build

# 本项目
npm link

# 引用调试的项目
npm link 包名

# 取消关联
npm unlink 包名

# 查看
npm ls -g