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 相关文章推荐
HTML IMG标签 onload 内存溢出导致浏览器CPU占用过高
Mar 09 Javascript
JavaScript生成GUID的多种算法小结
Aug 18 Javascript
jQuery中offsetParent()方法用法实例
Jan 19 Javascript
jQuery实现带滚动线条导航效果的方法
Jan 30 Javascript
javascript实现3D切换焦点图
Oct 16 Javascript
原生javascript实现解析XML文档与字符串
Mar 01 Javascript
关于网页中的无缝滚动的js代码
Jun 09 Javascript
自制简易打赏功能的实例
Sep 02 Javascript
无限循环轮播图之运动框架(原生JS实现)
Oct 01 Javascript
vue2手机APP项目添加开屏广告或者闪屏广告
Nov 28 Javascript
浅谈针对Vue相同路由不同参数的刷新问题
Sep 29 Javascript
如何开发一个渐进式Web应用程序PWA
May 10 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递归返回值时出现的问题解决办法
2013/02/19 PHP
PHP获取文件夹大小函数用法实例
2015/07/01 PHP
php设计模式之委托模式
2016/02/13 PHP
laravel-admin表单提交隐藏一些数据,回调时获取数据的方法
2019/10/08 PHP
laravel5.6 框架操作数据 Eloquent ORM用法示例
2020/01/26 PHP
CL vs ForZe BO5 第一场 2.13
2021/03/10 DOTA
JavaScript 参考教程
2006/12/29 Javascript
javascript 写类方式之三
2009/07/05 Javascript
Javascript 解疑
2009/11/11 Javascript
jQuery 锚点跳转滚动条平滑滚动一句话代码
2010/04/30 Javascript
怎样在JavaScript里写一个swing把数据插入数据库
2012/12/10 Javascript
jQuery中end()方法用法实例
2015/01/08 Javascript
基于jQuery实现仿微博发布框字数提示
2016/07/27 Javascript
基于jQuery实现滚动切换效果
2016/12/02 Javascript
将angular-ui的分页组件封装成指令的方法详解
2017/05/10 Javascript
react-native组件中NavigatorIOS和ListView结合使用的方法
2017/09/30 Javascript
Bootstrap 模态框自定义点击和关闭事件详解
2018/08/10 Javascript
微信小程序实现时间预约功能
2018/11/27 Javascript
Vue使用JSEncrypt实现rsa加密及挂载方法
2020/02/07 Javascript
js实现文章目录索引导航(table of content)
2020/05/10 Javascript
[56:20]LGD vs VP Supermajor 败者组决赛 BO3 第三场 6.10
2018/07/04 DOTA
[51:36]Optic vs Newbee 2018国际邀请赛小组赛BO2 第一场 8.17
2018/08/18 DOTA
Pycharm学习教程(3) 代码运行调试
2017/05/03 Python
使用 Python 实现文件递归遍历的三种方式
2018/07/18 Python
Python实现二叉树的常见遍历操作总结【7种方法】
2019/03/06 Python
使用python 写一个静态服务(实战)
2019/06/28 Python
Python3内置模块random随机方法小结
2019/07/13 Python
Python开发之pip安装及使用方法详解
2020/02/21 Python
美国最流行的男士时尚网站:Touch of Modern
2018/02/05 全球购物
Airbnb爱彼迎官网:成为爱彼迎房东,赚取收入
2019/03/14 全球购物
英国电子产品购物网站:Tech in the basket
2019/11/08 全球购物
SAZAC的动物连体衣和动物睡衣:Kigurumi Shop
2020/03/14 全球购物
this关键字的含义
2015/04/08 面试题
优秀应届毕业生推荐信
2014/02/18 职场文书
经典公益广告词
2014/03/13 职场文书
检讨书1000字
2014/10/11 职场文书