在 vue 的原型上注入配置文件，配置文件通过异步 http 访问获取，如何控制初始化顺序？

Question

使用的脚手架是 vue-cli4, 现在需求是这样的，要实现前端的可配置化，比如 axios 访问的 http 地址可配置，这样就在 public 文件夹中增加一个 config 的文件夹，里面专门放一些 json 配置文件。 因为要在 js 文件中访问这些全局配置，所以我打算把这些配置挂载到 vue 的原型，然后在 main.js 中这样做:

!(async () => { await axios.get('configs.json').then(response => { Vue.prototype.$config = response.data }) })()

new Vue({ router, store, render: h => h(App) }).$mount('#app')

那么我现在有个问题，如果配置文件体积过大，导致在其他 js 使用配置项的时候还没有返回，应该怎么处理这种情况？也就是说，我最好把获取 configs.json 同步化，不需要异步获取配置文件，但是访问 public 中的东西又没办法直接 import，有没有啥好的方案处理这种情景？

Answer 1

• axios.interceptors.request.use 使用request拦截器，同步获取配置文件，然后进行缓存