vue-cli4 vue.config.js如何配置全局变量

danranshizhi
  • 144

vue-cli4搭建vue项目,打包时会生成serverconfig.json文件,该文件中baseUrl为后台服务地址,在main.js中通过axios中获的设置的baseUrl,目前在谷歌浏览器打包后的js文件加载顺序是正常的,但是火狐,ie都不对,请问要如何修改js加载的顺序?或者如何通过vue.config.js配置全局变量?

火狐浏览器:

image.png

谷歌浏览器:

image.png

main.js 发送get请求,获取serverconfig.json中的请求地址
image.png

axios请求:
image.png

获取baseUrl:
image.png

回复
阅读 3.8k
1 个回答

编译时变量可以在项目根目录下新建一个 .env 文件(注意开头的 .)。

里面以键值对的形式写出环境变量,键名需要以 VUE_APP_ 开头。vue-cli 打包时会自动寻找这些环境变量,注入到编辑上下文环境中。


例如:

// .env
VUE_APP_PRO_BASE_URL=https://sample-pro.com
VUE_APP_DEV_BASE_URL=https://sample-dev.com
// http.js
if (process.env.NODE_ENV === 'pruduction') {
    VUE.prototype.BASE_URL = process.env.VUE_APP_PRO_BASE_URL;
} else {
    VUE.prototype.BASE_URL = process.env.VUE_APP_DEV_BASE_URL;
}

还可以按环境新建不同的 .env 文件,会自动识别,就不用再 if 判断了。

https://cli.vuejs.org/zh/guid...
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
你知道吗?

宣传栏