在前端开发过程中，当后台服务器开发数据还没完善，无法与前端进行交接时，我们习惯在本地写上一个json文件作模拟数据测试代码效果是否有问题。
vue-cli3.0往后的项目基础架构对比旧版本有些区别。以前大家都习惯在根目录下的static文件夹下创建json文件，然而vuecli3、4没有static文件夹了。若创建一个static文件夹在下面存放json文件，在实际调用过程中会报错，提示请求404。因此本文将提供两种方法调用本地的json文件。
1. 利用Axios请求调用本地json文件
Vue cli3削减掉static文件夹，取而代之的是在项目根目录下（与src同级）生成public文件夹，用于存放静态资源，如下图所示，可以将本地json文件放到public文件夹下。
利用axios的get请求方式，可以调用上述json文件。
axios.get('/confidence-band.json').then(res => {
console.log(res.data)
})
需注意，axios是异步的，如果转成同步进行，需要在外函数添加async，axios前加await。
2. import直接调用（推荐）
上述方式本地json文件必须存放指定位置，同时还要考虑同步异步的问题。利用import引用，本地json文件无需存放指定位置，以存放assets文件夹下的json文件夹为例。
引用及调用：
import confidence_band_json from '@/assets/json/confidence-band.json' // 引用
let data = confidence_band_json // 调用
两种方式各自有使用场景，若无要求，建议使用第二种方式，调用更为简单。