VueJs本地资产路径

时间:2017-09-27 10:22:15

标签: vue.js vuejs2 axios quasar

我正在开发一个Vuejs应用程序。基于Quasar Framework,在src / components / Hello.vue中 我有一个加载json文件的功能

GET http://localhost:8080/assets/json/ar/ch78.json 404 (Not Found)

它返回错误axios.get('../assets/json/ar/myfile.json')

所以我的问题是如何从src / assets文件夹中获取文件? {{1}}此行需要更正

1 个答案:

答案 0 :(得分:3)

如果数据是静态的(如本例所示),您可以这样导入:

import myFile from './json/ar/myfile.json'
console.log(myFile.someProp); // will work

据我所知,Quasar Framework已配置json loader

如果数据是动态的(例如,您在编译时不知道文件名),则应将服务器域存储在config中的某个位置,并将其与动态路径连接。它可能看起来像这样:

import { BASE_URL } from './config'
const lang = getCurrentLang(); // this is dynamic

axios.get(`${BASE_URL}/assets/json/${lang}/myfile.json`)
     .then()
     .catch();

在这种情况下,./config可能如下所示:

export const BASE_URL = 'http://localhost:8080';