一、环境变量应用场景
一个产品的前端开发过程中，一般会经历本地开发、测试、打包上线等过程，不同的环境可能需要不同的配置，比如接口地址、服务器地址、端口等等。
因此，可以使用环境变量来管理不同环境下使用的配置
二、四种方式的环境变量
所有的设置环境变量文件必须放到代码文件夹的根目录下
1、.env
配置所有情况下都用到的配置。理论上这个最没吊用，都用到的配置，还配置个毛。
2、.env.local
配置所有情况下都用到的配置，但是与1的区别是，这个这是本地有效，不会被git
3、.env.[mode]
配置对应某个模式下的配置。
.env.development:开发环境的配置
.env.production:打包环境的配置
4、.env.[mode].local
效果同2，不会被git
三、如何定义环境变量
在相应模式的配置文件里面，定义需要的环境变量，定义有格式要求;
如果是在src文件夹内使用，则必须要以VUE_APP_变量名称=value的形式，字符串也不用加引号“”。
如果是在webpack配置中使用，没什么限制，可以直接通过process.env.XXX来使用
四、如何使用环境变量
在src文件夹内，定义好后，通过process.env.VUE_APP_变量名，来使用。
在vue文件中，可以在data中定义个变量，将这个值传给变量
原文：https://www.cnblogs.com/rzqy/p/11066334.html