最近下载了vue-cli3，研究了vue-cli3下的多环境配置。

首先，安装vue-cli3。

npm安装-g @vue/cli

安装后，项目是这样的，如下图所示：

与vue-cli2项目相比，构建和配置目录缺失，静态目录没有了，但是有一个公共目录。

你需要为配置文件写一个vue.config.js，可以参考官方文档和网址来写

https://cli.vuejs.org/zh/config/

现在让我们专注于如何配置多个环境。打开package.json文件，如下图所示：

在脚本中修改环境配置，可以根据自己的项目修改相应的环境，如下图所示：

修改后，在项目的根目录下创建相应的文件。文件名以。env紧随其后。名称，例如：环境脂肪

写下你想写的配置。环境脂肪，如下图所示：

注意：需要以VUE-APP_开头，以下名称可选。我在这里设置了一个VUE_APP_APP_HOST来存储对应的服务器API地址。

最后介绍了系统中的配置。env.fat文件可以通过执行npm run fat引入到项目中。在Vue项目中，可以使用中设置的Vue_APP_APP_HOST。env.fat和其他以Vue_APP_开头的设置也可以读取。

以上就是边肖介绍的vue-cli3多环境封装配置的详细讲解和集成，希望对大家有所帮助。如果你有任何问题，请给我留言，边肖会及时回复你。非常感谢您对我们网站的支持！