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查询DBpedia小应用实例学习
Mar 07 Javascript
jquery利用命名空间移除绑定事件的方法
Mar 11 Javascript
js实现图片无缝滚动
Dec 23 Javascript
[原创]JQuery 在表单提交之前修改 提交的值
Apr 14 Javascript
JS中使用apply方法通过不同数量的参数调用函数的方法
May 31 Javascript
jQuery实现侧浮窗与中浮窗切换效果的方法
Sep 05 Javascript
JS数组返回去重后数据的方法解析
Jan 03 Javascript
Vue.js实战之组件的进阶
Apr 04 Javascript
node文字生成图片的示例代码
Oct 26 Javascript
七行JSON代码把你的网站变成移动应用过程详解
Jul 09 Javascript
vue 获取到数据但却渲染不到页面上的解决方法
Nov 19 Vue.js
javascript中导出与导入实现模块化管理教程
Dec 03 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/12/29 PHP
利用PHP访问带有密码的Redis方法示例
2017/02/09 PHP
PHP判断json格式是否正确的实现代码
2017/09/20 PHP
js 判断checkbox是否选中的操作方法
2012/11/09 Javascript
javascript提取URL的搜索字符串中的参数(自定义函数实现)
2013/01/22 Javascript
图片翻转效果具体实现代码
2014/01/09 Javascript
Node.js中的事件驱动编程详解
2014/08/16 Javascript
js验证真实姓名与身份证号是否匹配
2015/10/13 Javascript
关于javascript中dataset的问题小结
2015/11/16 Javascript
详解JS中Array对象扩展与String对象扩展
2016/01/07 Javascript
Javascript中函数名.length属性用法分析(对比arguments.length)
2016/09/16 Javascript
React-router 4 按需加载的实现方式及原理详解
2017/05/25 Javascript
微信小程序定位当前城市的方法
2018/07/19 Javascript
JS闭包原理与应用经典示例
2018/12/20 Javascript
微信小程序实现的一键连接wifi功能示例
2019/04/24 Javascript
Vue响应式原理Observer、Dep、Watcher理解
2019/06/06 Javascript
微信小程序 如何保持登录状态
2019/08/16 Javascript
Vue可自定义tab组件用法实例
2019/10/24 Javascript
javascript将扁平的数据转为树形结构的高效率算法
2020/02/27 Javascript
简单了解Vue + ElementUI后台管理模板
2020/04/07 Javascript
详谈Object.defineProperty 及实现数据双向绑定
2020/07/18 Javascript
Python操作MySQL模拟银行转账
2018/03/12 Python
python 给DataFrame增加index行名和columns列名的实现方法
2018/06/08 Python
用Python将mysql数据导出成json的方法
2018/08/21 Python
python读写配置文件操作示例
2019/07/03 Python
基于Python和PyYAML读取yaml配置文件数据
2020/01/13 Python
使用Python爬虫库BeautifulSoup遍历文档树并对标签进行操作详解
2020/01/25 Python
PyTorch中torch.tensor与torch.Tensor的区别详解
2020/05/18 Python
Python Matplotlib绘图基础知识代码解析
2020/08/31 Python
《凡卡》教学反思
2014/04/09 职场文书
法人代表身份证明书及授权委托书
2014/09/16 职场文书
铣工实训报告
2014/11/05 职场文书
健康状况证明书
2014/11/26 职场文书
pandas求平均数和中位数的方法实例
2021/08/04 Python
python 进阶学习之python装饰器小结
2021/09/04 Python
详解CSS中postion和opacity及cursor的特性
2022/08/14 HTML / CSS