一个vue-cli项目有三个模式：
development(开发环境)模式，用于vue-cli-service serve。
production(生产环境)模式，用于vue-cli-service build 和 vue-cli-service test:e2e。
test(测试环境)模式，用于vue-cli-service test:unit。
在根项目》package.json下修改
{
...
"scripts":{
...
"test":"vue-cli-service test:unit"
}
...
}
一个模式可以包含多个环境变量。
也就是说，每个模式都会将NODE_ENV的值设置为模式的名称。比如在development模式下NODE_ENV的值会被设置为“development”。在production模式下NODE_ENV的值会被设置为“production”。
我们可以通过为.env文件增加后缀，来设置某个模式下特有的环境变量。
比如，在项目根目录下创建一个名为.env.development文件，那么在这个文件里面声明过的变量，就只会在development模式下被载入。
比如，在项目根目录下创建一个名为.env.production文件，那么在这个文件里面声明过的变量，就只会在production模式下被载入。
如果这个环境变量想同时在所有模式下被载入，可以声明在.env文件里。
注意一下环境变量声明的命名规范，只有以VUE_APP_开头的变量，会被webpack.DefinePlugin静态嵌入到客户端的包中。
（如果配置时项目正在运行，配置完成后需要结束项目，再次运行项目，才能生效。）
在根目录下》.env中添加代码
VUE_APP_DOMAIN=http://www.baidu.com
VUE_APP_TITLE=百度搜索
在根目录下》.env.development中添加代码
VUE_APP_DOMAIN=http://dev.baidu.com
在根目录下》.env.production中添加代码
VUE_APP_DOMAIN=http://production.baidu.com
在根目录》src》App.vue中修改代码： <script> ... export default{ ... created(){ console.log(process.env.VUE_APP_DOMAIN)
console.log(process.env.VUE_APP_TITLE)
} } </script>
输入以下命令，在控制台输出http://dev.baidu.com
npm run serve
输入以下命令，在控制台输出http://production.baidu.com
npm run build
serve -s dist
实际应用在接口地址。不同环境下使用不同的接口地址，显示不同的数据。
只需要在这三个文件里面统一变量名，然后在不同文件里面改变变量的值就可以了。