vue-cli-service build --mode 区分多个环境

有些时候，我们的项目会打包部署到多个环境，可能在不同环境中，我们需要进行区分，做不同的操作，这时候我们可以利用打包的--mode。

1. 首先在 package.json增加打包各模式的命令语句

2. 执行build命令打包

下面我们用示例【build:A】进行打包

    

 

 ？？我们打包用的是环境A，但为啥打印处理的【NODE_ENV】是development呢？别急别急

 

 默认情况下，只有3种模式，如果我们没有配置对应的env文件，那会默认读取development的配置文件，所以，想要环境变量跟着我们的打包命令走，那需要配置这个模式的env文件，【env.模式】

文件中定义的数据只能是【NODE_ENV】、【BASE_URL】、【VUE_APP_开头】这3种key

打包后得到的参数，是【.env】文件和【.evn.打包模式】文件合并一起的数据，如果key重复，以【.evn.打包模式】文件的值为最终结果

 

 

 总结：需要打包区分不同环境

1. "build:xxx": "vue-cli-service build --mode xxx"   配置环境打包命令

2. 需要创建【.env.mode的模式值】这个文件，如果没配置会默认读取dev的配置文件，文件里面可以配置专属的环境值，切记key只能是【NODE_ENV】、【BASE_URL】、【VUE_APP_开头】

3. 打包后打印的process.env的值是【.env.mode的模式值】文件与【.env】文件合并的对象值，如果key重复，最终结果为【.env.mode的模式值】文件值