vue3项目打包上线后,如何配置api接口地址,省去更换api再次打包
一、项目根目录下public文件夹创建static=>config.js文件
window.webConfig = {
//动态配置api(用于上线后更改api)
webApiBaseUrl: 'xxx',//基础接口地址
}
二、项目根目录下public文件夹index.html页面
<script src="<%= BASE_URL %>static/config.js"></script>
三、ts定义全局类型处(否则报错)
declare interface Window {
nextLoading: boolean
webConfig: any
}
四、在api接口请求响应拦截处 配置基础地址
//基础地址
const BASE_URL =
process.env.NODE_ENV === 'development'
? process.env.VUE_APP_API_URL
: window.webConfig.webApiBaseUrl
...
...请求拦截器
...响应拦截器
五、打包上线后直接更改public=>static=>config.js中地址即可