共计 712 个字符，预计需要花费 2 分钟才能阅读完成。
有这样一个需求，就是希望通过本地的 Json 文件来写入一些内容，比如请求后端接口的 API 前缀，我们在 public 目录下面新建一个 project.config.json 文件来做一些配置项：
{
"baseUrl": "http://192.168.199.201:10000/"
}
这样有一个好处就是项目打包发布之后的文件也可以通过更改这个静态文件来改变一些配置项，省的因为频繁更改配置，而需要重新打包
然后我们在程序的主文件 main.js 中来通过请求这个静态文件，然后将读取的结果存在 Vue 的全局属性 $config 下面
async function getConfig() {
return axios.get("./project.config.json").then((res) => {
Vue.prototype.$config = res.data
})
}
那么接下来我们还需要在 Vue 程序实例化之前就执行 getConfig() 方法，这样才能确保我们在请求后端接口的时候能提前拿到 API 的 baseUrl
async function createApp() {
new Vue({
router,
store,
render: (h) => h(App),
}).$mount("#app")
}
(async function() {
await getConfig()
await createApp()
})()
是不是很灵活，应该还有很多的场景能够用到该方法。
欢迎关注公众号“太空编程”
这里有硬核的编程知识，亦有有趣有料的行业资讯。
回复【ebook】，获得优质 kindle 电子书
回复【pdf】，获得前端相关电子书
回复【交流】，拉你进群，交流学习，一起成长，早日实现太空编程！
正文完
