在进行项目开发时，我们经常需要进行 API 接口调用，但提供服务的 API 接口一般都比较晚出来，这个时候一般都会考虑使用 Mock API 接口方式进行数据 Mock。一般公司都会搭建自己的 Mock 服务，但往往使用起来不那么顺手，有时候流程还很繁琐。easwebpack 目前提供基于文件目录的 Mock 服务，只要提供一个文件目录，就会提供基于文件目录的 HTTP 服务。这样有三个好处：




安装命令行


npm install easywebpack-cli -g


easy server  可以把一个本地文件目录作为一个 HTTP 服务，默认为当前执行目录，可以通过 -p 指定端口， -d 指定目录。默认已经开启跨域请求, 默认服务是 http://127.0.0.1:8888/ 。 (easy server 命令早期就已经支持，这次进行了增强，提供 JS 文件返回 JSON 数据的能力。easywebpack-cli 提供了非常多的辅助开发命令，请自行挖掘。）


image.png


快速开始


首先创建一个目录，这里就叫 mock， 新建文件后，可以通过 easy  server -d mock  的方式启动文件 mock 服务。可以通过 nohup &  在后台启动 Mock 服务： nohup  easy server -d mock & 


创建 JSON  文件 HTTP 服务  /api/user/info


{
  "state": {
    "code": 20000,
    "msg": "success"
  },
  "data": {
    "id": 1,
    "name": "sky",
    "blog": "https://easy-team.github.io",
    "doc": "https://yueque.com/easy-team",
    "github": "https://github.com/easy-team"
  }
}




创建基于 js  文件 HTTP 服务 /api/news/list



/**
 * 直接返回一个 JSON 数据
 * @returns {Object} JSON 格式
 * @example
 * - 返回 JSON 数据 http://127.0.0.1:8888/api/news/list
 * - 返回 源代码  http://127.0.0.1:8888/api/news/list.js 
 */
module.exports = {
  "state": {
    "code": 20000,
    "msg": "success"
  },
  "data": {
    "list":[
      {
        "id": 1,
        "title": "easywebpack 数据 Mock 服务"
      },
      {
        "id": 2,
        "title": "通过 easy build -d mock 方式启动 Mock 服务"
      }
    ]
  }
}




创建基于 js  文件函数方式 HTTP 服务 /api/news/search



/**
 * 可以是一个函数，参数 req, res 为 node http 服务对象
 * @param req res 为 node http 服务对象
 * @param req res 为 node http 服务对象
 * @returns {Object} JSON 格式
 * @example
 * - 返回 JSON 数据 http://127.0.0.1:8888/api/news/search
 * - 返回 源代码  http://127.0.0.1:8888/api/news/search.js 
 */
module.exports = function (req, res) {
  return {
    "state": {
      "code": 20000,
      "msg": "success"
    },
    "data": {
      "list": [
        {
          "id": Math.ceil(Math.random() * 10000),
          "title": "easywebpack 数据 Mock 服务"
        },
        {
          "id": Math.ceil(Math.random() * 10000),
          "title": "通过 easy build -d mock 方式启动 Mock 服务"
        }
      ]
    }
  }
}





如果需要引入第三方 Mock 库生成  Mock 数据，请自行在项目中安装相关 Mock 插件，然后在 JS 里面调用即可。