问题
- 新版本的vue将dev-server.js与webpack.dev.conf.js合并,若要写路由相关配置需要找到webpack.dev.conf.js中的devServer对象进行相关配置
具体方法
- (发现大家用的都是外卖app这个例子呢,,,大概大家都是看到这里出现了疑惑吧hhhh)
// webpack.dev.conf.js
// 通过express导入路由
const express = require('express')
const app = express()
var appData = require('../data.json')
// json卖家数据
var seller = appData.seller
// json商品数据
var goods = appData.goods
// json评论数据
var ratings = appData.ratings
// 编写路由
var apiRoutes = express.Router()
// 所有通过接口相关的api都会通过api这个路由导向到具体的路由
app.use('/api', apiRoutes)
// 注:找到devServer对象并在其后添加相关路由设置!!!
before (app) {
app.get('/api/seller', function (req, res) {
// 服务端收到请求后返回给客户端一个json数据
res.json({
// 当我们数据正常时,我们通过传递errno字符为0表示数据正常
errno: 0,
// 返回json中的卖家数据
data: seller
})
})
app.get('/api/goods', function (req, res) {
res.json({
errno: 0,
data: goods
})
})
app.get('/api/ratings', function (rea, res) {
res.json({
errno: 0,
data: ratings
})
})
}
注意事项
- 上面的第二段代码,需要找到devServer对象并加在其后,如下图: