npm i --save-dev mockup-webpack-plugin

1. 在webpack.config.js的plugins配置项中加入MockupWebpackPlugin

const MockupWebpackPlugin = require('mockup-webpack-plugin')

module.exports = {
  entry: 'index.js',
  output: {
    path: __dirname + '/dist',
    filename: 'index_bundle.js'
  },
  plugins: [
    new MockupWebpackPlugin()
  ]
}

2. 在webpackDevServer.config配置代理

module.exports = function(proxy, allowedHost) {
  return {
    proxy: {
      '/api': {
        target: 'http://localhost:7200',
        pathRewrite: {
          '^/api' : ''
        }
      }
    }
  };
}

3. 在根目录下新建插件的配置文件：mockup.config.json

| Name | Type | Required | Description | | :---------------: | :---------: | :------: | ------------------------------------------------------------ | | port | {number} | Y | 代理服务器的端口，与webpackDevServer.config中proxy.target一致 | | env | {string} | N | dev/online，只有在dev下才能dump静态mock文件
| mode | {String} | N | dev/online，请求接口时，响应数据的来源 | exemptionList | {Array} | N | 白名单 | openSchema | {Boolean} | N | 是否对请求、响应数据进行类型检验 | | proxy | {Object} | Y | 代理配置项 |

Options.proxy

dev/online：

| Name | Type | Required | Description | | :----------: | :--------: | :------: | ------- | | pid | {number} | Y | product_id，工程id | | token | {String} | Y | | | target | {String} | Y | 需要转发的目标路径 |

example

| port | 7200 | | ------ | ------------------------------------------------------------ | | pid | 2415 | | token | ee1c1fbb547e07fdb2bca1ad7650c6b3188ed976390e6eb311cc01249123c30c | | target | http://yapi.baidu-int.com/mock |

{
  "port": 7200,
  "env": "dev",
  "mode": "online",
  "exemptionList": [
    "/bmc/data/account/disable"

  ],
  "proxy": {
    "online": {},
    "dev": {
      "pid": 2415,
      "token": "ee1c1fbb547e07fdb2bca1ad7650c6b3188ed976390e6eb311cc01249123c30c",
      "target": "http://yapi.baidu-int.com/mock"
    }
  }
}

描述：

1. proxy['env']必须存在；
2. 当env=dev，且本地mockup文件不存在时，会自动dump文件；
3. mode和exemptionList的配合使用，如：mode='online'，存在于exemptionList中的请求会读取本地json文件里的数据作为Response，而不存在的则会访问线上接口获取响应；

1.0.1 初始版本

1.0.2 增加代理功能：支持手动选择数据来源（Yapi、本地）

1.0.4 增加Response Schema校验

1.1.1

①将webpackPlugin.options抽离为单独的配置文件，即：mockup.config.json；

②增加Request Query、Response Body校验；

③增加mock schema校验开关（暂未开启）；