vue Mock数据模拟后台数据

备注： 此项项目基于webpack模板创建项目（此方法相当于本地模拟数据请求）
fastmock模拟数据请求: 请参考

准备data.json 文件放在主目录下

然后在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(app){
  app.get('/api/appData', function(req, res){
    res.json({
      errno: 0,
      data: appData
    })
  }),
  app.get('/api/seller', function(req, res){
    res.json({
      errno: 0,
      data: seller
    })
  }),
  app.get('/api/goods', function(req, res){
    res.json({
      errno: 0,
      data: goods
    })
  }),
  app.get('/api/ratings', function(req, res){
    res.json({
      errno: 0,
      data: ratings
    })
  })
}

运行 npm run dev

如果有styl报错，将styl文件中格式换成最初的css格式即可
（链接：也就是之前将style.css是只用改文件后缀为styl即可，不用更改文件内容）

页面访问：在ip后加上/api/seller即可