前言

1. Vue-cli3添加模拟数据的插件
2. 可通过在mock文件夹下写静态数据
3. 也可通过编程是方式使用Mockjs生成假数据

安装

   vue add vmock

运行

   npm run vmock

使用说明

mock目录

1. 插件自动生成的用与存放json格式数据的目录

mock.config.js文件

1. 配置模拟接口地址
2. 处理接口请求

{
    //使用mock生成数据
    '/test': {
        "string|1-10": "★"
    },
    '/test2': {
        "string|1-10": "★a*"
    },
    //使用回调函数形式手动返回数据
    //req-express请求对象， res-express相应对象, next-express中的next，Mock-Mockjs对象
    '/test3': function (req, res, next, Mock) {
        //手动调用Mockjs生成数据
        //const Mock = require('mock');
        res.json(Mock.mock({
            "string|1-10": "Mock回调生成数据"
        }))
    }
}

vue.config.js配置

可以通过vue.confi.js前端测试服务启动端口

module.exports = {
  pluginOptions: {
    vmock: {
      port: 8000
    }
  }
}

#项目地址

https://gitee.com/odeng/vue-cli-vue-cli-plugin-vmockplugin-vmock.git

持续更新中 ✨✨✨✨