VueCli3.0中集成MockApi的方法示例

module.exports = {
 dev: {
  before: (app) => {
   // app就是底层的express实例，上面针对express实例的操作，全部换成app即可
  }
 }
}

3、至于mock的文件下面的js文件就是我们需要挂载到express的mock接口的信息，下面给出一个实例，其他仿照即可，一个js文件代表一个mock接口

// 注意，由于是针对子路由级别的，前端调用的url为/mock/get-info
module.exports = {
 api: '/get-info',
 response: (req, res) => {
  // 由于添加了body-parser中间件，所以可以解析传入的body，这里就可以用来动态的生成JSON
  const flag = req.body.flag;
  console.log(req.body);
  res.send(
   {
    success: flag,
    code: 0,
    data: [],
    message: '获取信息成功',
   },
  );
 },
};

四：结合上面的几点整合处理

五：其他几种方式的Mock接口

mock.js去，给出官网，它会修改原生的XMLHttpRequest来拦截ajax请求，同时提供强大的根据模板生成数据
fastmock，类似本地Mock，数据放在了外网，团队配合可以选择，具体使用见链接
后端Controller生成静态JSON，不推荐，后端不会吊我们的，搞不好会干架，哈哈

六：总结

前端工程化的出现能够让前端做的事情很多很多，技术的广度能够支持你做一些有意思的事情。首先这个可以做一些优化，比如本地的Mock可以使用mock.js纯处理一些数据的生成工作。注意mock接口的url和自己proxy的接口不要冲突。使用Vue-cli3.0，它不仅是封装了webpack的配置，同时提供了自己一套插件机制，接下来写一个简单的cli插件自动化完成这些操作，
敬请期待。欢迎评论交流。