good-tool

Good Tool 简介

前端开发小工具。主要功能：API 模拟、 API 转发、action 代码生成器、antd 提示文档。目前支持 get、post、put、delete、ws（自定义的，用来模拟WebSocket API）请求，支持ws和stompWs，支持文件下载，文件上传还未测试

环境要求：node^14.17.4，vscode^1.59.0

Good Tool 快速开始

通过下面三个步骤即可使用模拟数据功能。

第一步修改你的项目配置

package.json 文件中设置代理，端口号为本插件的监听端口，默认 21818（确认插件配置中的模拟数据功能开启，默认是开启的）

"proxy":"http://127.0.0.1:21818"

第二步添加 API 配置文件

在/.vscode/good-tool/目录下随意新建一个 json 文件(文件名没有要求并且可以有多个，但必须是 json 后缀，文件名不能是 proxy.json，该文件会被插件的其他模块读取)。你可以在配置文件中输入 rc 快速生成配置模板

[
  {
    "url": "/test",           // 请求的url地址
    "method": "get",          // 请求方式：get、post、put、delete、ws
    "data": [                 // 请求返回的数据
      {
        "name": "zzw",
        "username": "zhangzw"
      }
    ]
  }
]

也可以在 define 目录下创建模拟数据定义文件，配置好后在文件编辑区右击->点击生成模拟数据文件，即可根据定义的规则快速生成你想要的数据，.json 定义文件格式如下所示：

[
  {
    "url": "/test",
    "method": "get",
    "total": 2,     // 生成数据的数量,如果不传或者设置为0，则result返回对象，否则返回数组
    "columns": {    // 定义每条数据的key和value的类型，value支持：key | number | string | enum | timestamp | boolean | array
      "id": "key",  // 无需参数，生成uuid，保证唯一
      "name": "string",   // string: 随机生成长度0-128的字符串；string(10): 长度0-10；string(10, 100): 长度10-100
      "age": "number(0, 100)",  // number: 随机生成长度11的数字；number(5): 长度5；number(0, 100): 随机生成0-100的数字
      "sex": "enum(男,女)",   // 随机生成枚举值，该类型参数不能为空
      "time": "timestamp(hour)",   // 递增生成时间戳，参数支持: second | minute | hour | day | month | year | array，可不传默认为day
      "arr": "array(string(1,10),10)",  // 生成一个大小为10的字符串数组，字符串长度1-10(array类型两个参数都是必须的，第一个参数支持上述value的类型，但是不包括array)
      "company": {
        "total": 2,
        "columns": {
          "name": "string(10)",
          "age": "number"
        }
      }
    }
  }
]

第三步你将得到一个自动生成的API

打开浏览器输入：http://localhost:21818/test 来验证它

扩展功能

一、API 转发

在 good-tool 插件配置中设置 proxy 为后台服务器地址即可

二、多个代理

注意：如果在一个 vscode 窗口中打开了多个项目，插件会在每个项目下创建配置目录，并会读取每个项目下的配置文件，如果存在相同的配置，后面项目中的配置会覆盖掉前面的配置，日志统一写入到第一个项目中的 log.txt 中

你可能注意到配置中有个 useFileConfigProxy 配置项，该配置默认关闭，如果开启这项配置，proxy 配置项将会失效，但会在/.vscode/good-tool/目录下创建一个 proxy.json 文件，在该文件中输入 pc 即可出现配置模板。你可以配置多个项目不同的 source 对应不同的 target ，也可以配置同一个 source 对应不同的 target，但最后只会转发给最后一个配置的 target

[
  {
    // 本地服务url
    "source": "http://127.0.0.1:3000",
    // API服务器url
    "target": "https://10.182.226.48",
    // WebSocket服务器地址，不配置时默认取target
    "targetWs": "https://10.182.226.48",
    // 支持stompWs，默认为false，使用传统websocket
    "stompWs": true,
    // 描述信息
    "desc": "dev环境"
  }
]