环境变量
李国平 2021/6/11 vue
# 介绍
vue-element-admin 4.0 之后是基于 vue-cli来进行构建,所以所有的环境变量配置都是基于vue-cli来实现和控制的。
.env # 在所有的环境中被载入
.env.[mode] # 只在指定的模式中被载入
一个环境文件只包含环境变量的“键=值”对:
FOO=bar
VUE_APP_SECRET=secret
注意!!!
环境变量必须以VUE_APP_为开头。如:VUE_APP_API、VUE_APP_TITLE
你在代码中可以通过如下方式获取:
console.log(process.env.VUE_APP_xxxx)
除了 VUE_APP_* 变量之外,在你的应用代码中始终可用的还有两个特殊的变量:
NODE_ENV- 会是 "development"、"production" 或 "test" 中的一个。具体的值取决于应用运行的模式。BASE_URL- 会和vue.config.js中的publicPath选项相符,即你的应用会部署到的基础路径。
# 构建相关
除了一些写在.env的环境变量之外,还有一些构建和部署相关的变量都是需要在vue.config.js中配置的。
你可以通过process.env.NODE_ENV来执行判断环境,来设置不同的参数。
具体代码可借鉴vue.config.js (opens new window)
# 产品环境变量说明
已采购系统产品线的dev环境变量举例:
# just a flag
NODE_ENV = 'development'
# base api,接口统一前缀
VUE_APP_BASE_API = '/api'
# 代理后端接口访问地址,开发环境需要设置,发布环境无需
VUE_APP_API_BASE_HOME = 'http://192.168.0.202:32006'
# 对象存储访问域名,也是打包之后放在静态资源中的位置
VUE_APP_OSS_HOME = '/'
# 对象存储资源桶,也是打包生成的资源文件夹名称
VUE_APP_OSS_BUCKET = 'ithpurchase'
# 用于附件模板下载指定访问资源url
VUE_APP_OSS_TEMPLATE_HOME = '//s3.cn-south-1.thsrm.com/ith-dev/template'
# 单独登录服务地址 【重要】【不要修改】【配置host】
VUE_APP_SSO_HOST = 'http://login.ithcloud.com:3100'
# 平台标识
VUE_APP_PLATFORM_ID = 'b4c93f533b924ee1a0e8dbe7f7bb74d6'
# 流程设计器
VUE_APP_BPM_URL = 'http://bpm.ithcloud.com:3500'
各产品线环境变量略有差异,具体参照代码注释