前言
今天在写一个vue项目时，发现build中并没有dev-server.js文件，那如何进行后台数据模拟呢？
解决方法
最新的vue里dev-server.js被替换成了webpack-dev-conf.js
在模拟后台数据的时候直接在webpack-dev-conf.js文件中修改
第一步:在const portfinder = require(‘portfinder’)后面添加
const express
= require('express') const app
= express()
var appData
= require('../data.json')
var seller
= appData
.seller
var goods
= appData
.goods
var ratings
= appData
.ratings
var apiRoutes
= express
.Router() app
.use('/api', apiRoutes
)
第二步：找到devServer,在里面加上before（）方法
devServer
: {
clientLogLevel
: 'warning',
historyApiFallback
: true,
hot
: true,
compress
: true,
host
: HOST || config
.dev
.host
,
port
: PORT || config
.dev
.port
,
open
: config
.dev
.autoOpenBrowser
,
overlay
: config
.dev
.errorOverlay
? { warnings
: false, errors
: true }
: false,
publicPath
: config
.dev
.assetsPublicPath
,
proxy
: config
.dev
.proxyTable
,
quiet
: true,
watchOptions
: {
poll
: config
.dev
.poll
,
},
before(app
) {
app
.get('/api/seller', (req
, res
) => {
res
.json({
errno
: 0,
data
: seller
})
}),
app
.get('/api/goods', (req
, res
) => {
res
.json({
errno
: 0,
data
: goods
})
}),
app
.get('/api/ratings', (req
, res
) => {
res
.json({
errno
: 0,
data
: ratings
})
})
}
注意：要确保项目根目录有data.json，这里提供一个json数据
{ "seller": { "name": "粥品香坊（回龙观）",
"description": "蜂鸟专送",
"deliveryTime": 38,
"score": 4.2,
"serviceScore": 4.1,
"foodScore": 4.3,
"rankRate": 69.2,
"minPrice": 20,
"deliveryPrice": 4,
"ratingCount": 24,
"sellCount": 90,
"bulletin": "粥品香坊其烹饪粥料的秘方源于中国千年古法，在融和现代制作工艺，由世界烹饪大师屈浩先生领衔研发。坚守纯天然、0添加的良心品质深得消费者青睐，发展至今成为粥类的引领品牌。是2008年奥运会和2013年园博会指定餐饮服务商。",
"supports": [ { "type": 0,
"description": "在线支付满28减5"
},
{ "type": 1,
"description": "VC无限橙果汁全场8折"
},
{ "type": 2,
"description": "单人精彩套餐"
},
{ "type": 3,
"description": "该商家支持发票,请下单写好发票抬头"
},
{ "type": 4,
"description": "已加入“外卖保”计划,食品安全保障"
} ],
"avatar": "http://static.galileo.xiaojukeji.com/static/tms/seller_avatar_256px.jpg",
"pics": [ "http://fuss10.elemecdn.com/8/71/c5cf5715740998d5040dda6e66abfjpeg.jpeg?imageView2/1/w/180/h/180",
"http://fuss10.elemecdn.com/b/6c/75bd250e5ba69868f3b1178afbda3jpeg.jpeg?imageView2/1/w/180/h/180",
"http://fuss10.elemecdn.com/f/96/3d608c5811bc2d902fc9ab9a5baa7jpeg.jpeg?imageView2/1/w/180/h/180",
"http://fuss10.elemecdn.com/6/ad/779f8620ff49f701cd4c58f6448b6jpeg.jpeg?imageView2/1/w/180/h/180"
],
"infos": [ "该商家支持发票,请下单写好发票抬头",
"品类:其他菜系,包子粥店",
"北京市昌平区回龙观西大街龙观置业大厦底商B座102单元1340",
"营业时间:10:00-20:30"
] }}
