Vue.js获取本地json文件（数据mock）

在前后端分离式的开发中，如果后台接口还未开发完成，前端开发者就可以使用数据mock的方式，自建一些假数据模仿后台数据进行开发。下面是使用vue.js加载本地json文件的方法：

一、目录结构

image

二、步骤

1、将json文件放到项目中

2、在build下的webpack.dev.conf.js文件中插入如下代码：

const express = require("express");
const myApp = express();   // 创建express实例

var data = require("../data.json");   //引入data文件

3、接着在上述文件中的devServer对象中插入如下代码：
PS：关于devServer.before

before(app){
app.get('api/data', (req, res) => {
  res.json(data)
  });
}

decServr对象示意

4、访问localhost:8080/aip/data即可获得json格式的数据