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 相关文章推荐
JS中showModalDialog 的使用解析
Apr 17 Javascript
初步认识JavaScript函数库jQuery
Jun 18 Javascript
js表单登陆验证示例
Oct 19 Javascript
Vue2.0利用vue-resource上传文件到七牛的实例代码
Jul 28 Javascript
JavaScript模块模式实例详解
Oct 25 Javascript
Node.js创建Web、TCP服务器
Dec 05 Javascript
VUE Error: getaddrinfo ENOTFOUND localhost
May 03 Javascript
JS编写兼容IE6,7,8浏览器无缝自动轮播
Oct 12 Javascript
JS获取月的第几周和年的第几周实例代码
Dec 05 Javascript
es6中let和const的使用方法详解
Feb 24 Javascript
如何在面试中手写出javascript节流和防抖函数
Oct 22 Javascript
antd日期选择器禁止选择当天之前的时间操作
Oct 29 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
第八节--访问方式
2006/11/16 PHP
PHP 已经成熟
2006/12/04 PHP
php cli配置文件问题分析
2015/10/15 PHP
通过js动态操作table(新增,删除相关列信息)
2012/05/23 Javascript
JavaScript日期类型的一些用法介绍
2015/03/02 Javascript
基于javascript实现浏览器滚动条快到底部时自动加载数据
2015/11/30 Javascript
js点击文本框弹出可选择的checkbox复选框
2016/02/03 Javascript
深入理解选择框脚本[推荐]
2016/12/13 Javascript
微信小程序 支付功能开发错误总结
2017/02/21 Javascript
Vue关于数据绑定出错解决办法
2017/05/15 Javascript
详解webpack+angular2开发环境搭建
2017/06/28 Javascript
Vue上传组件vue Simple Uploader的用法示例
2017/08/25 Javascript
Vue.js最佳实践(五招助你成为vuejs大师)
2018/05/04 Javascript
如何在JavaScript中优雅的提取循环内数据详解
2019/03/04 Javascript
在vue中利用v-html按分号将文本换行的例子
2019/11/14 Javascript
基于vue实现简易打地鼠游戏
2020/08/21 Javascript
vue前端和Django后端如何查询一定时间段内的数据
2021/02/28 Vue.js
vue+flask实现视频合成功能(拖拽上传)
2021/03/04 Vue.js
[57:28]2018DOTA2亚洲邀请赛 4.6 淘汰赛 TNC vs Liquid 第一场
2018/04/10 DOTA
Python使用filetype精确判断文件类型
2017/07/02 Python
对python中for、if、while的区别与比较方法
2018/06/25 Python
Django中数据库的数据关系:一对一,一对多,多对多
2018/10/21 Python
pytorch 实现在一个优化器中设置多个网络参数的例子
2020/02/20 Python
解决python执行较大excel文件openpyxl慢问题
2020/05/15 Python
virtualenv介绍及简明教程
2020/06/23 Python
安装不同版本的tensorflow与models方法实现
2021/02/20 Python
人事部专员岗位职责
2014/03/04 职场文书
党的群众路线教育学习材料
2014/05/12 职场文书
预备党员学习十八届三中全会精神思想汇报
2014/09/13 职场文书
乡镇领导班子四风整顿行动工作汇报
2014/10/25 职场文书
英文道歉信
2015/01/20 职场文书
旅行社计调工作总结
2015/08/12 职场文书
2019年年中工作总结讲话稿模板
2019/03/25 职场文书
导游词之天津盘山
2019/11/01 职场文书
【HBU】数据库第四周 单表查询
2021/04/05 SQL Server
Python装饰器的练习题
2021/11/23 Python