vue env文件配置,vue项目配置环境变量
最常见的多环境配置是开发环境配置和生产环境配置。主要介绍vue项目多环境配置的实现，有兴趣的可以看看。
目录
什么是多环境配置，为什么要配置？在哪里，如何，有多少。env文件已配置？如何配置？env文件，如何配置运行环境，如何获取全局配置项的值，如何运行环境，在接触多环境配置之前，感觉好高大上，真正操作之后，感觉就是那样。在这里，我将描述我遇到的问题和解决方法，欢迎大家指出错误。
什么是多环境配置，为什么要多环境配置？
最常见的多环境配置是开发环境配置和生产环境配置(即在线配置)。在许多情况下，我们开发环境中的域名和一些配置项与我们生产模式中的不同。这时候就需要进行多环境配置了，不然每次发布都要换一波数据就麻烦了。在另一种情况下，您为两个项目使用一组代码，但是最后，您必须将它们打包到不同的包中。这时候多环境配置会大大提高开发效率。
.env 文件配置到哪里
的。env文件配置在项目的根目录中，其级别与package.json相同，如下所示。
.env文件如何配置，配置多少个？
.env文件如何命名？
刚开始网上查的时候，很多博主说名字一定要起名字。
中的配置文件。开发环境。生产环境中的env.production配置文件其实不是的。如果配置开发环境和生产环境，这样命名是可以理解的。但是如果你是多项目通用代码，这样命名就有点不对了。所以这一块的命名格式是只需要文件开头为.env即可，后面的名字你想怎样都可以。
.env文件的配置
这一块就是配置你想用的东西。例如，如果我想在全局项目中获得一个名称，您可以直接在。环境。我将在下面详细描述如何获取值。
当nprunserve或nprunbuild。默认情况下将采用env。
插图：
//这一块只需要用VUE_APP_***，用这种形式命名就可以了，后面是大写还是小写的那块看你心情了。
VUE_APP_NAME=楼鸳鸯
VUE _ APP _ HTTPS= http://www . louhc . com/
VUE应用缩写=louhc
VUE应用标识=louhc
违约后。env文件，然后我们将配置。有特殊要求的env文件。例如，我想在另一个环境中使用另一个名称。例如，在。env.bsy文件。bsy是我随便写的名字。这件可以定做。
//这一块只需要用VUE_APP_***，用这种形式命名就可以了，后面是大写还是小写的那块看你心情了。
VUE应用名称=白衬衫云
VUE _ APP _ HTTPS= http://www . louhc . com:82/
VUE应用缩写=bsy
VUE应用标识=bsy
以此类推，您可以任意配置。
之后。env文件匹配，现在是我们配置运行环境的时候了。
如何配置运行环境
找到package.json文件，如下所示
Build:和serve:后面都是你随便起的名字。它们必须相互对应，以便在运行时可以找到相应的配置项。
脚本:{
serve: vue-cli-service serve ，
build : vue-CLI-服务版本，
build:bsy : vue-CLI-服务构建模式bsy ，
构建：kthz : vue-CLI-服务构建模式kthz ，
“服务：bsy”:“vue-CLI-服务服务模式bsy”，
服务：kthz : vue-CLI-服务服务模式kthz ，
},
再说一遍：env是默认的配置项。运行环境配置项时，默认配置项将与正在运行的环境配置项合并。当参数相同时，环境配置项将是主项。简单来说，默认配置项存在，环境配置项也存在。此时将以运行环境配置项的值为准。如果默认配置项存在，但环境配置项不存在，则运行环境配置项。
如何获取全局配置项的值
示例：我想如何在js中获取vue _ app _ name=楼鸳鸯？然后只要在你要赋值的地方写这一行代码，process.env.VUE_APP_NAME。
console . log(process . env . vue _ app _ name)//默认打印是楼元阳bsy，白衬衫云在BSY。
如果我们的项使用html中全局配置项的值，我们需要先赋值作为回报，然后通过{{}}就可以得到你想要使用的值。
如何运行环境
运行默认环境npm运行服务器
运行指定的环境npm run serve:bsy
默认环境包npm运行构建
指定环境包npm运行构建：bsy
只需切换到不同的环境名称。
关于多环境配置实现的这篇文章到此为止(。vue项目的env)。请搜索我们以前的文章或继续浏览下面的相关文章，了解更多关于vue多环境配置的信息。希望你以后能支持我们！
郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。