jsx-mock-server v1.0.4

安装

npm i jsx-mock-server -g

全局安装即可

使用说明

命令行中使用如下命令获取帮助

mock-server --help

返回

Usage: mock-server [options]

命令：
  mock-server setting  desc: open setting.json
  mock-server mock     desc: open mock file
  mock-server start    desc: start mock server

选项：
  -h, --help     显示帮助信息                                             [布尔]
  -v, --version  显示版本号                                               [布尔]

示例：
  mock-server start

mock-server setting

改写setting配置文件

{
    "server": [ // 使用的服务数组，可以同时开启多个服务
        {
            "name": "test", // 服务名称，对应 server.json 里的服务名
            "port": 8088, // 本地服务端口号
            "mockfile": "test", // mock文件名称，如不填，则默认使用服务名称
            "proxyUrl": "https://xxx.xx.xx.xxx:443" // 代理的服务器地址
        }
    ]
}

可以同时开启多个服务，以便应用于同时mock多个项目的场景

mock-server mock

打开mock目录，目录下的文件名对应setting中的mockfile

-mock
 -test.jsx

在下文会介绍mockfile文件的详细语法

mock-server start

启用mock服务

mockfile文件，使用jsx语法

即我们示例中的test.jsx文件

// 需要先引入一下react
const React = require('react');

// 导出mock数据
module.exports = <mock>
    <post>
        <prefix name='trade'>
            <replace>{ data }</replace>
            <path name='queryTrade'>
                <target keys={ ['data', 'list', 0] }>
                    <merge>{ data }</merge>
                </target>
            </path>
        </prefix>
    </post>
    <get></get>
</mock>

• mock标签，声明启动mock数据
• post标签，声明这下面的都是 post 请求，与之对应的还有get标签
• prefix标签，表示一个请求的前缀
  • name 属性，表示前缀的值
• path标签，表示第 n 级接口地址到这里为止
  • 小提示：可以将path和prefix的值叠加使用，像这样： 或者
• replace标签，表示整个替换当前接口的返回值
• merge标签，表示和当前接口的返回值进行覆盖合并，就像Object.assign(接口实际返回值, mock值)

• target标签，表示会依次选择keys中的字段名，选择对对应的值进行replace或merge操作

  • 例如接口返回数据为

      {
          data: {
              list: [
                  {
                      test: test
                      // ...
                  }
              ]
          }
      }

    如果我只想replace返回数据中的data.list0，其它值保持不变，就可以指定keys为'data', 'list', 0

• 更多标签还在考虑中...

示例中的xml会被解析为：

[
    {
        method: 'POST',
        url: '/trade',
        type: 'replace',
        data: data
    },
    {
        method: 'POST',
        url: '/trade/queryTrade',
        target: true,
        targetKeys: ['data', 'list', 0],
        type: 'merge',
        data: data
    },
]

一些不对的写法

对于一些不严重的错误写法，会做兼容处理

<post test='test'>
    <prefix name='print'>
        <!-- 同一层级有多个 data 存在时，仅第一个生效 -->
        <replace>{ data1 }</replace>
        <!-- 这个会被忽略 -->
        <replace>{ data2 }</replace>
        <!-- 当标签内没有有效的数据项时，这个标签会被忽略 -->
        <prefix name='center1'></prefix>
    </prefix>
</post>