vue项目使用.env文件配置全局环境变量

关于文件名:必须以如下方式命名,不要乱起名,也无需专门手动控制加载哪个文件

.env 全局默认配置文件,不论什么环境都会加载合并

.env.development 开发环境下的配置文件

.env.production 生产环境下的配置文件
在这里插入图片描述


关于文件内容:

注意:属性名必须以VUE_APP_开头,比如VUE_APP_XXX

.env:
在这里插入图片描述
.env.development:
在这里插入图片描述


关于文件的加载:

根据启动命令vue会自动加载对应的环境,vue是根据文件名进行加载的,所以上面说“不要乱起名,也无需专门控制加载哪个文件”

比如执行npm run serve命令,会自动加载.env.development文件

启动项目:
在这里插入图片描述
打印process.env属性(全局属性,任何地方均可使用):
在这里插入图片描述在这里插入图片描述
可见NODE_ENV被改为了development,覆盖掉了.env中的全局属性

.env中的全局属性NODE_ENV、VUE_APP_URL被覆盖,

.env中的全局属性VUE_APP_PREVIEW、VUE_APP_DEFAULT_PARAM被保留

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/407110.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

在HTML网页中使用ActiveX控件

From: http://blog.163.com/haizai219126/blog/static/4441255520097264447968/ 1. 摘要: 在企业应用中,为了实现一些特殊的功能,如播放自有协议的视频,我们需要在传统的HTML网页中插入ActiveX控件,由ActiveX控件来满足…

CSS之深入理解 flex 布局以及计算

起因:对于Flex布局,阅读了大漠老师和其他老师写的文章后,我还是不太理解Flexbox是如何弹性的计算子级项目的大小以及一些其他细节。在大漠老师的帮助下,我去查阅Flexbox 的 W3C 规范文档 1. 对于flex盒模型的设计期望&#xff1a…

IBM副总裁自述的数据中心简化经验

2008年11月19日,IBM在北京隆重举行了以“开启企业基础架构创新之旅,体验全新企业级数据中心”为主题的IBM 2008企业基础架构创新峰会。51CTO.com记者程鸿应邀参加了此次峰会。在此次峰会上,IBM全新企业级数据中心副总裁Elaine Lennox女士、IB…

vue中有关.env;.env.development,.env.production的相关介绍

1,关于文件名:必须以如下方式命名,不要乱起名,也无需专门手动控制加载哪个文件 .env 全局默认配置文件,不论什么环境都会加载合并 .env.development 开发环境下的配置文件 .env.production 生产环境下的配置文件 2…

CSS之中间固定两边自适应宽度

第一种:浮动布局实现 HTML: 这种方法我利用的就是浮动原理,左右定宽度分别进行左浮动和右浮动,此时主内容列(中间列没有定度)主会自动插入到左右两列的中间,最要注意的一点是,中间列…

将ocx和DLL文件打包成cab文件,inf的编写

From: http://icrwen.iteye.com/blog/1118766 http://blog.csdn.net/yimiyangguang1314/article/details/6563540 将ocx和DLL文件打包成cab文件,实现IE浏览器在线安装 分类: Windows应用2010-03-25 18:36 2722人阅读 评论(14) 收藏 举报我们打开淘宝等网…

用ADOQuery创建SQL Server数据库,并创建表结构、存储过程和视图

昨天做系统的安装,搞这个搞到头大,现在把总结写下巴。 PS:贴上来代码的缩进就乱掉了 用SQL Server企业管理器导出的SQL文件是不能直接在ADOQuery里用的,因为ADOQuery不支持GO,不支持注释,视图和存储过程的创…

CSS之左定宽度右自适应宽度并且等高布局

一、两列布局:左边固定宽度,右边自适应宽度 方法1:浮动布局 采用的是左边浮动,右边加上一个margin-left值,让他实现左边固定,右边自适应的布局效果 HTML: CSS: 上面这种实现方法最关键之处就是自适应宽度…

Linux scp 免密码 传输文件

SCP的使用 背景介绍 最近项目是集群化部署(由 node1,node2,node3 三台 CentOS 7.4 的虚拟机构成)。 但是,涉及到跨机器同步文件的问题,想通过写shell文件实现,用 crontab 设置定时任务&#…

ActiveX控件打包成Cab置于网页中自动下载安装

From: http://www.iteye.com/topic/110834 makeCAB.rar (188.5 KB) [背景] 做过ActiveX控件的朋友都知道,要想把自己做的ActiveX控件功能放在自己的网页上使用,那么用户在客户端就必须进行本地的注册,也就是说用户得首先要把该ActiveX控件(te…

CSS之创建等高列布局之一

高度相等列在Web页面设计中永远是一个网页设计师的需求。如果所有列都有相同的背景色,高度相等还是不相等都无关紧要,因为你只要在这些列的父元素中设置一个背景色就可以了。但是,如果一个或多个列需要单独设置自己的背景色,那么它…

一篇介绍VC开发OCX的文章,写得太棒了!!!

From: http://www.cnblogs.com/gengaixue/archive/2010/08/13/1799112.html VC2005从开发MFC ActiveX ocx控件到发布到.net网站的全部过程 开篇语:最近在弄ocx控件发布到asp.net网站上使用,就是用户在使用过程中,自动下载安装ocx控件。&…

使用webpack打包后的vue项目如何运行(express)

我们知道使用webpack打包vue项目后会生成一个dist文件夹,dist文件夹下有html文件和其他css、js以及图片等,那么打包后的文件该如何正确运行呢? 倘若直接打开html文件,会报如下错误: 那么该如何运行呢?其实…

CSS之创建等高列布局之二

3. 给容器div使用单独的背景色(流体布局) 这种布局可以说是就是第二种布局方法,只是这里是一种多列的流体等高列的布局方法。前面也说过了,其实现原理就是给每一列添加相对应用的容器,并进行相互嵌套,并在…

git 上传代码步骤

接下来 第一步:建立git仓库 cd到你的本地项目根目录下,执行git命令,此命令会在当前目录下创建一个.git文件夹。 git init 第二步:将项目的所有文件添加到仓库中 git add . 这个命令会把当前路径下的所有文件,添加…

CSS之创建等高列布局之三

4. 使用正padding和负margin对冲实现多列布局方法 这种方法很简单,就是在所有列中使用正的上、下padding和负的上、下margin,并在所有列外面加上一个容器,并设置overflow:hiden把溢出背景切掉。下面一起来看代码 HTML: CSS: 这里代码的关键…

git报错:‘fatal:remote origin already exists‘怎么处理?附上git常用操作以及说明。

git添加远程库的时候有可能出现如下的错误, 怎么解决? 只要两步: 1、先删除 $ git remote rm origin2、再次执行添加就可以了。   ----------------------------------------------git常用操作---------------------------------------…