VUE3中,使用.env.development和.env.production

news2024/11/14 17:59:57

在实际项目开发过程中,可能开发环境和生产(测试)环境不一样,经常需要修改配置常量,才能满足对应的环境,才能使软件运行起来。在vue3中可以使用2个文件进行区分。

.env.development:开发环境

.env.production:生产(测试)环境

1.首先使用HBuilder X建立一个VUE3项目,并且能跑起来

2.分别建立2个文件,必须以VITE_开头,否则无法识别,如图所示

3.然后在使用的地方加上如下命令

import.meta.env.VITE_TEST

4.重新启动服务器,一定要重新启动服务器,否则无效

打开浏览器,我们可以看到输出了开发环境。

5.选择build,生成生产模式,程序就在dist中

6.此时,我这里使用nginx进行发布,当然你也可以使用别的发布网址,比如IIS等等。

 nginx的配置,之前文档已经介绍了,这里不再说明。

Windows中使用nginx部署网站_故里2130的博客-CSDN博客_nginx部署网站

部署完成后,直接打开,我这里是808端口。

打开浏览器,我们可以看到输出了生产环境。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/141464.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

Mysql存储引擎 初级(自用笔记)

内容来自于(https://www.bilibili.com/video/BV1Kr4y1i7ru?p58&vd_source3cf72bb393b8cc11b96c6d4bfbcbd890) 1.存储引擎 1.1Mysql体系结构 1.2什么是存储引擎呢? 存储引擎就是存储数据,建立索引,更新,查询数据等技术的实现方式. 存储引擎是基于表的,而不是基于数据库的…

魔兽世界开服教程wow服务器框架Trinirycore构建

首先明杰先给各位普及一下TrinityCore是什么TrinityCore 是c实现MMORPG框架来自MaNGOS,大型网络对象服务,随着时间的推移,该项目代码广泛的优化,改善和清理代码。需要准备的架设工具:端(版本)、…

皮尔逊相关性分析一文详解+python实例代码

目录 前言 一、数值类型 二、皮尔逊系数使用场景 二、皮尔逊相关系数(Pearson correlation) 1.定义 2.线性关系判定 3.正态检验 1.KS检验 4.计算代码 点关注,防走丢,如有纰漏之处,请留言指教,非常感谢 参阅 前言 相关性…

MySQL中这10个小玩意,让人眼前一亮

我最近几年用MYSQL数据库挺多的,发现了一些非常有用的小玩意,今天拿出来分享到大家,希望对你会有所帮助。 1.group_concat 在我们平常的工作中,使用group by进行分组的场景,是非常多的。 比如想统计出用户表中&…

给Kylin iso中添加自定义rpm包

前言 在日常产品交付中会有如下需求: 客户自己安装centos / ubuntu / kylin iso,然后我们把rpm包给到客户 我们直接将rpm包封装到iso,给客户交付整体iso,这样不管是对于客户还是对于公司都是最省心的,会避免很多因为系…

疯狂2023:科技迎来爆发之年,关注云计算这些方向

临近年末,熬过艰难苦恨繁霜鬓的2022,打工人已默默扛起来年的OKR 。根据市场研究机构Garner预测,2023将迎来科技爆发之年,最值得关注的云计算趋势是AI和ML、多云和混合云解决方案、物联网、云安全等。 及时了解不断变化的技术格局…

汇聚数据库创新力量 GBASE携手openGauss助企业数字化转型

12月29日,openGauss Summit 2022于线上举行。本次大会是由openGauss开源数据库社区联合行业组织、伙伴及客户共同举办的一场年度数据库产业界交流与分享峰会。天津南大通用数据技术股份有限公司(简称:GBASE)首次以openGauss社区理…

PDF转换成JPG图片怎么转换?这两招轻松搞定

PDF转换成JPG图片怎么转换?PDF文件是我们常用的一类文件,在现在的办公环境中,PDF真的用途很广,不仅是日常发送文件,还有学习工作中都会用到,不过有时候我们也需要将PDF文件转换成其他的格式,比如…

JUC并发编程学习笔记(五)读写锁和阻塞队列

8 读写锁 8.1 悲观锁和乐观锁介绍 回顾悲观锁和乐观锁的概念 悲观锁:单独每个人完成事情的时候,执行上锁解锁。解决并发中的问题,不支持并发操作,只能一个一个操作,效率低 顾名思义,就是比较悲观的锁&am…

配置文件中命名空间的作用

命名空间 实际上就是一个由程序设计者命名的内存区域,程序设计者可以根据需要指定一些有名字的空间域,把一些全局实体分别放在各个命名空间中,从而与其他全局实体分隔开来。 命名空间的作用 是建立一些互相分隔的作用域,把一些…

11_3、Java集合之迭代器Iterator接口

一、引入Iterator对象称为迭代器(设计模式的一种),主要用于遍历 Collection 集合中的元素。 GOF给迭代器模式的定义为:提供一种方法访问一个容器(container)对象中各个元 素,而又不需暴露该对象的内部细节。迭代器模式,就是为容器…

华脉智联铁路巡检及指挥调度系统

技术方案 整套系统基于云通讯平台和智能终端的结合,实现指挥中心和现场人员的实时互动,同时保证现场取证材料的实时上报以及指挥中心实时将决策及命令下发到现场人员。提高巡检效率及巡检准确性。 方案拓扑如下: 在指挥中心通信机房部署指挥…

k8s集群监控cadvisor+prometheus+grafana部署

目录 1.新建命名空间monitor 2.部署 2.1部署cadvisor 2.2部署node_exporter 2.3部署prometheus资源 2.4部署rbac权限 2.5.部署 metrics 2.6部署grafana 3.测试效果 参考文章: k8s集群部署cadvisornode-exporterprometheusgrafana监控系统 - cyh00001 - 博客园 …

JDBC --- 数据库连接池 C3P0

目录 1、基本定义 2、使用C3P0(数据库连接池)的必要性 2.1.JDBC传统模式开发存在的主要问题 2.1.1时间和内存资源消耗巨大 2.1.2 有内存泄漏的风险 3、数据库连接池的详细说明 4、使用连接池的明显优势 4.1.资源的高效利用 4.2.更快的系统反应速…

linux中awk命令和argxs命令的详解使用

一 awk命令1.1 命令的作用awk为行命令处理器,对每一行的文本数据,进行格式化文本信息。目的:在处理庞大文件时不会出现内存溢出或是处理缓慢的问题。1.2 案例应用获取某一行文本数据,提取不同字段的值。1.显示整行数据[rootlocalh…

怎么把照片合成一张?看完这篇文章你就知道了

大家平时有没有遇到过这样的情况?好朋友们组团一起出去玩,但是你因为个人原因无法跟大家一起去。这就可能导致姐妹中的合照少了你一个人,那么要怎样在图片上添加你去了的效果呢?其实很简单,只要编辑图片进行合成就可以…

指针进阶(1)

( )> [ ] > -> > -- > . > * (优先级比较) tips 1. (全是笔者个人自己总结,仅供参考,随意取用) 2. 3. 地址唯一标识一块内存空间 4. printf%s打印字符串的话只要给一个起始地址…

【 Vue3 + Vite + setup语法糖 + Pinia + VueRouter + Element Plus 第二篇】(持续更新中)

在第一篇中我们讲述了Vue3框架的搭建以及Vue3的常用语法,这篇文章将使用 Axios 和 Element Plus 并使用封装组件的方式完成表格搭建。 本期需要掌握的知识如下: 引入并封装 Axios 请求配置 .env 文件通过 api 接口获取数据 下期需要掌握的知识如下: 组件的封装和…

MySQL主从延迟的解决方案

1、MySQL主从延迟的解决方案 之前项目中基于 MySQL 主从复制以及 AOP 的方式实现了读写分离,也写了博客记录了这个实现过程。既然配置了 MySQL 主从复制,那么自然会存在主从延迟,如何尽可能减小主从延迟对应用系统的影响是很有必要的思考点&a…

特征工程原理(一)

一、定义 在机器学习原理中讲过机器学习的基本流程,其中很重要的一个环节就是特征工程。 1.1 基本概念 特征工程(Feature Engineering):从原始数据中提取特征的过程,这些特征可以很好地描述数据,并且利用…