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


Posted in Javascript onOctober 24, 2019

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

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

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

.env.production 生产环境下的配置文件

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

关于文件内容:

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

.env:

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

.env.development:

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

关于文件的加载:

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

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

启动项目:

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

打印process.env属性(全局属性,任何地方均可使用):

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

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

可见NODE_ENV被改为了development,覆盖掉了.env中的全局属性

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

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

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
Jquery知识点二 jquery下对数组的操作
Jan 15 Javascript
通过jQuery源码学习javascript(一)
Dec 27 Javascript
JS中判断null、undefined与NaN的方法
Mar 24 Javascript
AngularJS基础学习笔记之控制器
May 10 Javascript
简介JavaScript中fixed()方法的使用
Jun 08 Javascript
Vue.js实现一个自定义分页组件vue-paginaiton
Sep 05 Javascript
jQuery右下角悬浮广告实例
Oct 17 Javascript
Angular.js与node.js项目里用cookie校验账户登录详解
Feb 22 Javascript
JavaScript动态绑定详解
Sep 14 Javascript
js实现页面多个日期时间倒计时效果
Jun 20 Javascript
js实现一款简单踩白块小游戏(曾经很火)
Dec 02 Javascript
Vue+Java 通过websocket实现服务器与客户端双向通信操作
Sep 22 Javascript
微信小程序上传图片并等比列压缩到指定大小的实例代码
Oct 24 #Javascript
nest.js 使用express需要提供多个静态目录的操作方法
Oct 24 #Javascript
Vue 3.0双向绑定原理的实现方法
Oct 23 #Javascript
JavaScript判断数组类型的方法
Oct 23 #Javascript
Vue 2.0双向绑定原理的实现方法
Oct 23 #Javascript
p5.js绘制旋转的正方形
Oct 23 #Javascript
p5.js实现简单货车运动动画
Oct 23 #Javascript
You might like
PHP 命令行工具 shell_exec, exec, passthru, system详细使用介绍
2011/09/11 PHP
使用php清除bom示例
2014/03/03 PHP
PHP编写文件多服务器同步程序
2016/07/02 PHP
基于Laravel实现的用户动态模块开发
2017/09/21 PHP
JavaScript中常见陷阱小结
2010/04/27 Javascript
js和jquery对dom节点的操作(创建/追加)
2013/04/21 Javascript
解决javascript:window.close()在chrome,Firefox下失效的问题
2013/05/07 Javascript
JS设置获取cookies的方法
2014/01/26 Javascript
js实现jquery的offset()方法实例
2015/01/10 Javascript
js获取checkbox值的方法
2015/01/28 Javascript
解决js页面滚动效果scrollTop在FireFox与Chrome浏览器间的兼容问题的方法
2015/12/03 Javascript
JavaScript实现HTML5游戏断线自动重连的方法
2017/09/18 Javascript
解决vue中对象属性改变视图不更新的问题
2018/02/23 Javascript
解决Nodejs全局安装模块后找不到命令的问题
2018/05/15 NodeJs
node.js使用redis储存session的方法
2018/09/26 Javascript
详解TypeScript+Vue 插件 vue-class-component的使用总结
2019/02/18 Javascript
详解JS取出两个数组中的不同或相同元素
2019/03/20 Javascript
vue踩坑记-在项目中安装依赖模块npm install报错
2019/04/02 Javascript
es6中new.target的作用和使用场景简单示例分析
2020/03/14 Javascript
js利用拖放实现添加删除
2020/08/27 Javascript
js将日期格式转换为YYYY-MM-DD HH:MM:SS
2020/09/18 Javascript
Python with标签使用方法解析
2020/01/17 Python
Django调用百度AI接口实现人脸注册登录代码实例
2020/04/23 Python
python mysql自增字段AUTO_INCREMENT值的修改方式
2020/05/18 Python
Python xlwings插入Excel图片的实现方法
2021/02/26 Python
Nixon手表英国官网:美国尼克松手表品牌
2020/02/10 全球购物
房产销售经理职责
2013/12/20 职场文书
英语演讲稿范文
2014/01/03 职场文书
护士思想汇报
2014/01/12 职场文书
毕业生工作求职信
2014/06/30 职场文书
临时工聘用合同协议书
2014/10/29 职场文书
事业单位岗位说明书
2015/10/08 职场文书
2016计算机专业毕业生自荐信
2016/01/28 职场文书
2019年大学毕业生个人自我鉴定范文大全
2019/03/21 职场文书
Python借助with语句实现代码段只执行有限次
2022/03/23 Python
Python实现灰色关联分析与结果可视化的详细代码
2022/03/25 Python