json5

前后端联调一般的逻辑是，前端通过ajax访问后端，后端通过json数据返回给前端。 使用mockjs就是通过mock模拟服务器响应，要在项目当中拦截请求并且用mockjs返回数据。 一般是通过 webpack下devServer的before属性 做拦截。 ①vuecli脚手架根目录新建vue.config.js，键入如下代码： module.exports = { devServer: { before: require('./mock/index.js') //引入mock的index.js } } ②根目录mock文件夹下新建index.js，键入如下代码： /* * @Descriptions: * @Version: * @Author: * @Date: 2020-06-18 23:20:14 * @LastEditors: dongwenjie * @LastEditTime: 2020-06-18 23:27:11 */ const fs = require('fs'); const path = require('path'); const Mock = require('mockjs'); const JSON5 = require('json5'); // 读取json文件 function getJsonFile(filePath) { //

一、mockjs使用场景 前后端分离的开发模式当中，前台一般都会比较依赖后端的接口数据以及数据格式，常常会出现没有接口，前台很多工作都没法开展的情况，这时候前端如果能模拟一些假数据，并模拟真实请求，就能不用等待后端接口完成之后，就能把功能完善掉。下面给大家介绍下mockjs在项目当中的基本使用方法。（ 前提是前端和后端要把数据格式和字段规定好！ ） 二、mockjs在项目当中的初步测试 ①安装依赖 // 安装mockjs cnpm i mockjs --save-dev // 安装axios http请求库 cnpm i axios --save // 安装json5 可以再json中写注释，而且有自带api解析json格式的数据 cnpm i json5 --save-dev ②首先附mockjs的官网： http://mockjs.com/examples.html （详细用法请到官网上自行尝试） 项目根目录下新建mock文件夹，其下在新建testMock.js文件，写入： // 引入mockjs const Mock = require('mockjs'); // 生成随机id let id = Mock.mock('@id'); console.log(id); // 生成随机用户信息 let obj = Mock.mock({ id: '@id', username: '