在项目开发中，联调是家常便饭，也是比较耗时的一个环节。在前后端分离的项目中，我们往往先约定好接口和数据，再进行开发。这时候，如果前端能够自己启动一个服务，按照一定的规则生成假数据，联调起来就会方便很多。市面上有很多mock数据工具，但是我用的是mockjs。首先你要明白mockjs并不能启动一个服务，它只是一个产生数据的工具。我们需要自己启动服务，接收请求，返回数据给前端。这里我用的是express，比较好用。express的安装就不详细说了。讲几个重点。在项目的路由文件中，我们可以这样模拟数据：//使用MockvarMock=require('mockjs')vardata=Mock.mock({//属性列表的值是一个数组，其中包含1to10元素'list|1-10':[{//属性id是一个自增数，初始值为1，每次加1'id|+2':1}]})这个生成假数据，然后通过路由返回，这样写：router.get('/',function(req,res,next){//下面四行用来设置返回的响应头，解决跨域问题res.header("Access-Control-Allow-Origin","*");res.header("Access-Control-Allow-Methods","PUT,GET,POST,DELETE,OPTIONS");res.header("Access-Control-Allow-Headers","X-Requested-With");res.header("Access-Control-Allow-Headers","Content-Type");//这一行将是构造的假数据被返回res.send(data);res.render('index',{title:'Express'});});这样我们就成功mock到了数据，接下来就是请求接口了。在vue-cli3中，在vue.config.js文件中设置本地服务器：module.exports={devServer:{proxy:{//不明白这里的key值为什么要这样写，我会待会再研究看看[""]:{//假设我们的mock服务启动在3000端口target:`http://127.0.0.0:3000`,//这里用来设置跨域changeOrigin:true,//这里的路径其实我没明白rewriting是什么意思。我再研究一下pathRewrite:{['^/']:''}}},}}重写配置后记得重启服务，然后就可以愉快的玩了。mock服务可以用nodemon来启动，这样服务只要有变化就会自动重启，效率会高很多。
