VUE项目使用.env文件配置全局环境变量
时间:2022-07-24
本文章向大家介绍VUE项目使用.env文件配置全局环境变量,主要内容包括其使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。
文件名
关于文件名:必须以如下方式命名,不要乱起名,也无需专门手动控制加载哪个文件
.env 全局默认配置文件,不论什么环境都会加载合并
.env.development 开发环境下的配置文件
.env.production 生产环境下的配置文件
内容
注意:属性名必须以VUE_APP_开头,比如VUE_APP_URL VUE_APP_XXX
文件的加载
根据启动命令vue会自动加载对应的环境,vue是根据文件名进行加载的,所以上面说“不要乱起名,也无需专门控制加载哪个文件”
比如执行npm run serve命令,会自动加载.env.development文件
注意:.env文件无论是开发还是生成都会加载的公用文件
配置package.json文件可以具体设置启动具体加载哪个.env.XXX文件
"scripts": {
"dev": "vue-cli-service serve",
"build": "vue-cli-service build",
"dev:prod": "vue-cli-service serve --mode production",
"dev:test": "vue-cli-service serve --mode test",
"dev:kunpeng": "vue-cli-service serve --mode kunpeng",
"build:prod": "vue-cli-service build --mode production",
"build:test": "vue-cli-service build --mode test",
"build:kunpeng": "vue-cli-service build --mode kunpeng",
"build:dev": "vue-cli-service build --mode development",
"build:stage": "vue-cli-service build --mode staging",
"preview": "node build/index.js --preview",
"lint": "eslint --ext .js,.vue src",
"svgo": "svgo -f src/icons/svg --config=src/icons/svgo.yml",
"new": "plop"
},
"dev:kunpeng": "vue-cli-service serve --mode kunpeng",
"dev:kunpeng": "vue-cli-service serve --mode kunpeng" 启动的时候就会加载.env.kunpeng文件。
.env文件都要加载如果两个文件有相同一个项,后加载文件会覆盖第一个文件。
- Windows Server 2008 R2 网络负载平衡 (NLB)资料汇总
- 0.[Andriod]之从零安装配置Android Studio并编写第一个Android App
- WordPress 后台编辑文章页面添加自定义提示文字
- 使用json 和jQuery制作级联dropdownlist
- 在64位Windows 7/2008操作系统上部署32位的Web应用程序错误
- 云计算浪潮
- 2.[Andriod]Andriod Studio结合Visual Studio Emulator for Android调试Android App
- Windows Server AppFabric Caching
- zepto 基础知识(2)
- DeepMind回顾2017年:除了战胜柯洁还有哪些大事
- [认证授权] 1.OAuth2授权
- 机器学习(四)——梯度下降算法解释以及求解
- 在Windows上运行单节点的Cassandra
- Mono技术规格
- JavaScript 教程
- JavaScript 编辑工具
- JavaScript 与HTML
- JavaScript 与Java
- JavaScript 数据结构
- JavaScript 基本数据类型
- JavaScript 特殊数据类型
- JavaScript 运算符
- JavaScript typeof 运算符
- JavaScript 表达式
- JavaScript 类型转换
- JavaScript 基本语法
- JavaScript 注释
- Javascript 基本处理流程
- Javascript 选择结构
- Javascript if 语句
- Javascript if 语句的嵌套
- Javascript switch 语句
- Javascript 循环结构
- Javascript 循环结构实例
- Javascript 跳转语句
- Javascript 控制语句总结
- Javascript 函数介绍
- Javascript 函数的定义
- Javascript 函数调用
- Javascript 几种特殊的函数
- JavaScript 内置函数简介
- Javascript eval() 函数
- Javascript isFinite() 函数
- Javascript isNaN() 函数
- parseInt() 与 parseFloat()
- escape() 与 unescape()
- Javascript 字符串介绍
- Javascript length属性
- javascript 字符串函数
- Javascript 日期对象简介
- Javascript 日期对象用途
- Date 对象属性和方法
- Javascript 数组是什么
- Javascript 创建数组
- Javascript 数组赋值与取值
- Javascript 数组属性和方法
- 使用docker 搭建redis的主从复制
- 使用Python判断文件下是否有空文件夹
- MySQL 设置用户可以远程连接
- MySQL关于character_set 设置为uft8问题
- nohup 退出终端不退出任务
- windows 下Redis开机自启动
- 机器学习基础:决策树的可视化
- 持续部署入门:基于 Kubernetes 实现蓝绿发布
- PHP 实现Redis发布订阅消息及时通讯
- 简单几步,用云开发搞定短信验证码登录
- 重要的进程就让Supervisor 来守护吧!
- 机器学习基础:令你事半功倍的pipeline处理机制
- django 中如何将字典变量传给template视图层的JS
- Spring第三天:Spring的AOP的注解开发、Spring的声明式事务、JdbcTemplate
- Spring Boot中集成Slf4j 与Logback