1. Vue-cli3.0项目节省了很多文件，比如讲vue-cli3.0之前版本的build/dev-server.js配置放在了vue.config.js中。
2. 在Vue-cli3.0项目的vue.config.js或vue-cli3.0之前版本的build/dev-server.js中配置：
const express = require(‘express‘)
const app = express()
var singer = require(‘./src/db/data/singer.json‘) //本地json文件数据
var recommend=require(‘./src/db/data/recommend.json‘)
var apiRoutes = express.Router();
app.use(‘/api‘,apiRoutes)
module.exports = {
devServer:{
before(app) {
app.get(‘/api/singer‘, (req, res) => {
res.json({
errno: 0, // 这里是你的json内容
data: singer
})
})
app.get(‘/api/recommend‘, (req, res) => {
res.json({
errno: 0, // 这里是你的json内容
data: recommend
})
})
},
open: process.platform === ‘darwin‘,
host: ‘0.0.0.0‘,
port: 8080,
https: false,
hotOnly: false,
proxy: null //设置跨域，即将本文件内任何没有匹配到的静态文件，都指向跨域地址
},
}
3. 再组件内使用axios调用本地json文件数据：
import axios from ‘axios‘
axios.get("/api/singer").then((data)=>{
console.log(data)
})
注意：vue cli3.0 public 文件夹才是静态资源文件,修改了vue.config.js需要重启项目。
原文地址：https://www.cnblogs.com/yj19/p/11137429.html