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 相关文章推荐
Javascript写了一个清除“logo1_.exe”的杀毒工具(可扫描目录)
Feb 09 Javascript
setAttribute 与 class冲突解决
Feb 17 Javascript
javascript中的原型链深入理解
Feb 24 Javascript
js定时器(执行一次、重复执行)
Mar 07 Javascript
JavaScript中的typeof操作符用法实例
Apr 05 Javascript
javascript与Python快速排序实例对比
Aug 10 Javascript
JS将滑动门改为选项卡(需鼠标点击)的实现方法
Sep 27 Javascript
JS不完全国际化&本地化手册 之 理论篇
Sep 27 Javascript
bootstrap table小案例
Oct 21 Javascript
基于wordpress的ajax写法详解
Jan 02 Javascript
如何制作一个Node命令行图像识别工具
Dec 12 Javascript
微信小程序实现简易table表格
Jun 19 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随机抽奖实例分析
2015/03/04 PHP
PHP laravel中的多对多关系实例详解
2017/06/07 PHP
浅析PHP类的反射来实现依赖注入过程
2018/02/06 PHP
Vagrant(WSL)+PHPStorm+Xdebu 断点调试环境搭建
2019/12/13 PHP
javascript网页关键字高亮代码
2008/07/30 Javascript
Jquery 快速构建可拖曳的购物车DragDrop
2009/11/30 Javascript
javascript sudoku 数独智力游戏生成代码
2010/03/27 Javascript
javascript 中String.match()与RegExp.exec()的区别说明
2013/01/10 Javascript
js运动框架_包括图片的淡入淡出效果
2013/05/11 Javascript
jquery实现兼容浏览器的图片上传本地预览功能
2013/10/14 Javascript
10分钟学会写Jquery插件实例教程
2014/09/06 Javascript
JavaScript基础知识及常用方法总结
2016/01/10 Javascript
javascript中call apply 与 bind方法详解
2016/03/10 Javascript
详解AngularJS通过ocLazyLoad实现动态(懒)加载模块和依赖
2017/03/01 Javascript
js+canvas实现动态吃豆人效果
2017/03/22 Javascript
es6学习笔记之Async函数基本教程
2017/05/11 Javascript
js每隔两秒输出数组中的一项(实例)
2017/05/28 Javascript
jquery.uploadView 实现图片预览上传功能
2017/08/10 jQuery
angular4自定义组件详解
2017/09/28 Javascript
javascript 函数的暂停和恢复实例详解
2020/04/25 Javascript
python列表与元组详解实例
2013/11/01 Python
Python中实现从目录中过滤出指定文件类型的文件
2015/02/02 Python
使用python实现ANN
2017/12/20 Python
python修改txt文件中的某一项方法
2018/12/29 Python
Python 分发包中添加额外文件的方法
2019/08/16 Python
将tf.batch_matmul替换成tf.matmul的实现
2020/06/18 Python
python使用re模块爬取豆瓣Top250电影
2020/10/20 Python
Finishline官网:美国一家领先的运动品牌鞋类、服装零售商
2016/07/20 全球购物
德国宠物用品、宠物食品及水族馆网上商店:ZooRoyal
2017/07/09 全球购物
美国高级工作服品牌:Carhartt
2018/01/25 全球购物
波兰最大的度假胜地和城市公寓租赁运营商:Sun & Snow
2018/10/18 全球购物
网站开发实习生的自我评价
2013/12/11 职场文书
中文专业自荐书
2014/06/29 职场文书
纪检干部个人对照检查材料
2014/09/23 职场文书
2016党员干部廉政准则学习心得体会
2016/01/20 职场文书
导游词之重庆渣滓洞
2020/01/08 职场文书