vuecli4+配置开发生产测试环境

1. 在项目根目录新建3个文件夹

.env.development 指定当前环境模式为开发环境
.env.production 指定当前环境模式为生产
.env.test 指定当前环境模式为测试

.env.development
NODE_ENV = ‘development’
VUE_APP_BASE_URL = “开发的服务地址”

.env.production
NODE_ENV = “production”
VUE_APP_BASE_URL = “生产的服务地址”

.env.test
NODE_ENV = ‘test’
VUE_APP_BASE_URL = “测试的服务地址”

2. package.json key为 scripts的对象配置如下

 	"serve": "vue-cli-service serve",
    "dev": "vue-cli-service build --mode development",
    "test": "vue-cli-service build --mode test",
    "prod": "vue-cli-service build --mode production",
    "lint": "eslint --fix --ext .js,.vue src"

4. 使用 设置完后需要重启服务

console.log(process.env)

5. 如果要自定义的变量名来区分开发还是测试还是正式

在对应建的的文件里面以 VUE_APP_XXX = xxx 对象形式来写
如果不以 VUE_APP_XXX = xxx 就不会显示，就没有对应的key 和值