第1步：了解环境变量的概念我们可以在根目录下的以下文件中指定环境变量：.env#Loadedinallenvironments.env.local#inAllenvironments被加载，但会被git忽略包含“key=value”对环境变量：FOO=barVUE_APP_SECRET=secret//只有以VUE_APP_开头的环境变量才能在项目代码中直接使用。除了自定义的VUE_APP_*变量之外，在您的应用程序代码中还有两个始终可用的特殊变量：NODE_ENV-将是“开发”、“生产”或“测试”之一。确切的值取决于应用程序运行的模式。BASE_URL-将匹配vue.config.js中的publicPath选项，这是你的应用程序将被部署的基本路径。为特定模式准备的环境文件（例如.env.production）将比一般环境文件（例如.env）具有更高的优先级。模式概念：模式是VueCLI项目中的一个重要概念。一般来说，VueCLI项目默认有三种模式：开发模式为vue-cli-serviceserveproduction模式为vue-cli-servicebuild和vue-cli-servicetest:e2etest模式为vue-cli-servicetest:unit模式都没有相当于NODE_ENV，一个模式可以包含多个环境变量。也就是说，每个模式都将NODE_ENV的值设置为模式的名称（可以通过重新分配更改）——例如，在开发模式下，NODE_ENV的值将设置为“开发”。您可以通过向.env文件添加后缀来设置特定于某种模式的环境变量。比如你在项目根目录下创建一个名为.env.development的文件，这个文件中声明的变量只会在开发模式下被加载。您可以通过传递--mode选项来覆盖命令行的默认模式。例如，如果你想在构建命令中使用开发环境变量，请在你的package.json脚本中添加："dev-build":"vue-cli-servicebuild--modedevelopment"，环境变量的使用：仅限变量以VUE_APP_开头的会被webpack.DefinePlugin静态嵌入到客户端包中（也就是在项目代码中使用）。你可以像这样在应用程序代码中访问它们：console.log(process.env.VUE_APP_SECRET)了解指令、模式和环境变量之间的关系我们经常在项目中的package.json中的一个Vue中看到如下指令中CLI项目，@vue/cli-service安装一个名为vue-cli-service的命令。您可以在npm脚本中将此命令作为vue-cli-service访问，或从终端访问./node_modules/.bin/vue-cli-service。vue-cli-serviceserveUsage:vue-cli-serviceserve[options][entry]选项:--open服务器启动时打开浏览器--copy服务器启动时复制url到cut版本--mode指定环境模式（默认：development）--host指定主机（默认：0.0.0.0）--port指定端口（默认：8080）--https使用https（默认：false）vue-cli-servicebuildusage:vue-cli-servicebuild[options][entry|pattern]选项：--mode指定环境模式（默认：production）--dest指定输出目录（默认：dist）--modern用于具有自动构建应用程序回退功能的现代浏览器--targetapp|库|厕所|wc-async(default:app)--namelibraryornameinWebComponentsmode(default:"name"fieldinpackage.jsonorentryfilename)--no-clean在构建项目之前不清除目标目录--report生成report.html帮助分析包内容--report-json生成report.json帮助分析包内容--watch监听文件变化以上是两个常用的cli命令，分别对应开发和生产模式默认情况下，如果想了解其他命令，可以访问：https://cli.vuejs.org/zh/guid...CLI服务那么接下来，我们开始创建测试环境打包模式；修改package.json添加一行命令"test":"vue-cli-servicebuild--modetest"添加.env.test文件在项目根路径下创建.env.test文件，内容为NODE_ENV='production'//表示这是production环境（需要打包）VUE_APP_CURRENTMODE='test'//表示生产环境模式信息VUE_APP_BASEURL='http://***.****.com:8000'//测试服务器地址修改api接口文件在我的项目中，我一般会创建一个api.js来管理所有的接口url，因为我们在本地开发环境是通过代理连接服务器的，所以把url写成`${baseUrl}/apis/v1/login`，通过环境变量baseUrl=''更改文件开头的baseUrl;if(process.env.NODE_ENV=='development'){baseUrl=""}elseif(process.env.NODE_ENV=='production'){baseUrl=process.env.VUE_APP_BASEURL}else{baseUrl=""}当我们需要打包测试环境时，只需要运行如下命令打包npmruntest
