vue-cli3下将请求地址的配置文件分离出来以便于打包后可动态修改请求地址;
基本思路:
1.在public文件下新建serverConfig.json
`{
"production":"https://www.easy-mock.com/mock/5bd2d48f3e503e20f0011196/testUrl",
"develop":"https://www.easy-mock.com/mock/5bd2d48f3e503e20f0011196/testUrl"
}`;
2.在main.js中请求serverConfig.json文件,
`function getServerConfig () {
return new Promise ((resolve, reject) => {vue
axios.get('./serverConfig.json').then((result) => { let config = result.data; let ajaxUrl = process.env.NODE_ENV == 'production' ? config.production:config.develop; Vue.prototype.$ajaxUrl=ajaxUrl; //设置全局 store.commit('setAjaxUrl',ajaxUrl);//存储到vuex中 resolve(); }).catch((error) => { console.log(error) reject() })
})
}
async function init() {
await getServerConfig();
new Vue({ios
router, store, render: h => h(App),
}).$mount('#app')
}
init();
`
请求路径就直接用$ajaxUrl就能够了。
只因此存储到vuex中,是由于,若是你封装了request请求,没法直接获取到请求的地址,也没法用到全局$ajaxUrl,只能从vuex中获取,若是没有封装,直接用$ajaxUrl就能够ajax