uniapp和vite项目配置多环境编译,增加测试环境变量配置--mode test

news2024/11/24 5:48:02

如果你的项目是使用vite和uniapp配置开发的,就可以在代码里面获取到这些变量,但是开发,测试和发布是不同的请求地址,所以需要配置。Vite 使用 dotenv 从你的 环境目录 中的下列文件加载额外的环境变量:

.env                # 所有情况下都会加载
.env.local          # 所有情况下都会加载,但会被 git 忽略
.env.[mode]         # 只在指定模式下加载
.env.[mode].local   # 只在指定模式下加载,但会被 git 忽略

环境加载优先级:

一份用于指定模式的文件(例如 .env.production)会比通用形式的优先级更高(例如 .env)。 

另外,Vite 执行时已经存在的环境变量有最高的优先级,不会被 .env 类文件覆盖。例如当运行 VITE_SOME_KEY=123 vite build 的时候。

.env 类文件会在 Vite 启动一开始时被加载,而改动会在重启服务器后生效。

根据vite文档,我们创建4个环境文件,注意,环境文件只能放在项目根目录上,否则不生效。

其中,development与prodution环境是内置的环境,对应的uni 、 uni build命令(运行,发行),test为自定义的模式。补充:

import.meta.env.MODE: {string} 应用运行的模式。

import.meta.env.BASE_URL: {string} 部署应用时的基本 URL。他由base 配置项决定。

import.meta.env.PROD: {boolean} 应用是否运行在生产环境(使用 NODE_ENV='production' 运行开发服务器或构建应用时使用 NODE_ENV='production')。

import.meta.env.DEV: {boolean} 应用是否运行在开发环境 (永远与 import.meta.env.PROD相反)。

import.meta.env.SSR: {boolean} 应用是否运行在 server 上。

我们在.env.testing 该自定义环境里定义几个变量 :

VITE_BASE_URL="http://192.168.31.212:9041/v1"

注意:定义的环境变量必须以 VITE_ 为前缀的变量才会暴露给经过 vite 处理的代码。

这里自定义的VITE_BASE_URL与VITE自带的变量BASE_URL有不同的含义,VITE中的BASE_URL代表的是该项目运行后的公共基础路径,通过uni cli的选项 --base去配置,而配置后的只则通过import.meta.env.BASE_URL去获取 ;而我自定义的VITE_BASE_URL本意则是记录后端的接口地址,不要混淆。

在项目中就可以拿到了:


onShow(() => {
  console.log("App Show");
  console.log("当前环境", import.meta.env.VITE_BASE_URL)
});

在编译的时候,配置一个新的脚本,并跟上: --mode test

//package.json

"scripts" : {
    "test:h5": "uni --mode test"
}

自定义的环境模式只能通过uni cli 的选项 --mode {mode} 来实现,这也是为什么 使用HBuliderX cli 创建的项目不推荐使用.env,因为就算配置了.env文件,且确实在环境中可以拿到这些环境变量,但是只支持「运行」和「发行」对应的 .env.development 和.env.production ,如果我们想自定义一个test测试环境变量,是拿不到的,因为只能通过uni cli对应的mode选项标志去跑对应的环境,而HBuilderX无法配置mode

我们在package.json中加一条命令test:h5 ,然后在终端运行npm run test:h5 来运行该模式(当然也可以直接在npm run dev:h5 后直接加--mode)

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

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

相关文章

动态规划 - 编辑距离

115. 不同的子序列 困难 给你两个字符串 s 和 t ,统计并返回在 s 的 子序列 中 t 出现的个数,结果需要对 10^9 7 取模。 算法思想:利用动态规划,分s[i - 1] 与 t[j - 1]相等,s[i - 1] 与 t[j - 1] 不相等两种情况具…

sudo apt install jupyter-notebook安装notebook失败E: Aborting install.

问题: sudo apt install jupyter-notebook安装notebook失败E: Aborting install. ~/jie/mywork/PointNetCFD$ sudo apt install jupyter-notebook --fix-missing Reading package lists... Done Building dependency tree Reading state information... Do…

第16课 核心函数(方法)

掌握常用的内置函数及其用法。 数学类函数:abs、divmod、max、min、pow、round、sum。 类型转换函数:bool、int、float、str、ord、chr、bin、hex、tuple、list、dict、set、enumerate、range、object。 序列操作函数:all、any、filter、m…

【1个月速成Java】基于Android平台开发个人记账app学习日记——第2天,启动项目

24.11.01 下面讲一下如何通过USB连接手机然后启动app实现真机测试,还是有一些坑的。 调整电脑的驱动程序,完成USB的连接 在启动项目的第一步我就遇见了问题,那就是插入usb线以后没有检测到设备。想要完成连接需要2个步骤,第一步…

使用Mac如何才能提高OCR与翻译的效率

OCR与截图大家都不陌生,或许有的朋友对于这两项功能用到的不多,但是如果经常会用到的话,那你就该看看了 iOCR,快捷键唤出翻译窗口,不论是截图翻译、划词翻译、输入翻译、剪切板翻译,统统快捷键完成&#x…

Etsy又被封号了!这次我终于搞懂了原因...

你是否真的了解在Etsy开店有哪些红线不能踩?你是否真的知道Etsy被封号后如何解决?本文我将探讨Etsy账号被封的常见原因,以及卖家可以采取的应对策略,以期减轻对跨境业务的伤害程度,感兴趣的商家速速码住,不…

MySQL — 事务 (o゚▽゚)o

文本目录: ❄️一、什么是事务: ❄️二、ACID特性: ❄️三、使用事务: ▶1、查看支持事务的存储引擎: ▶2、语法: ▶3、开启并且回滚: ▶4、开启并且提交: ▶ 5、保存点&#xff…

DOS时代软件遗憾落幕,国产编程新势力接过火炬

在计算机发展史上,DOS时代是一个不可磨灭的篇章。那个时期,虽然操作系统的图形界面尚未普及,但一款款经典软件却为我们打开了通往数字世界的大门,让我们在那个相对简单却充满魅力的时代中,感受到科技的魅力与创新的力量…

Qt的信号槽机制学习一

一、Qt理论知识简记 (一)信号与槽[1] 信号与槽是Qt编程的基础,其使得处理界面上各个组件的交互操作变得比较直观和简单,GUI(Graphical User Interface)程序设计的主要工作就是对界面上各组件的信号进行相应…

P11232 [CSP-S 2024] 超速检测

P11232 [CSP-S 2024] 超速检测 难度:普及/提高。 考点:二分、贪心。 题意: 题意较长,没有题目大意,否则你也大意。 主干道长度为 L L L,有 n n n 辆车,看做左端点为 0 0 0,第 …

使用GetX实现GetPage中间件

前言 GetX 中间件(Middleware)是 GetX 框架中的一种机制,用于在页面导航时对用户进行权限控制、数据预加载、页面访问条件设置等。通过使用中间件,可以有效地控制用户的访问流程,并在适当条件下引导用户到所需页面。 这…

JAVA:常见 JSON 库的技术详解

1、简述 在现代应用开发中,JSON(JavaScript Object Notation)已成为数据交换的标准格式。Java 提供了多种方式将对象转换为 JSON 或从 JSON 转换为对象,常见的库包括 Jackson、Gson 和 org.json。本文将介绍几种常用的 JSON 处理…

视频怎么去水印?7个视频去水印在线工具大比拼,宝藏工具推荐!

您是否正在寻找一款好用的视频去水印在线工具,却总是难以找到合适的去水印软件?别担心,今天在本文中小编将和大家分享一些去水印的小助手。很多人都觉得视频或图片上的水印十分烦人。如果您有着同样的烦恼,那么使用去水印工具将是…

如何一键更换ppt模板?掌握这2个ppt技巧快速搞定!

每当要制作ppt,很多人会第一时间去搜刮各种ppt模板,有时我们找到了一份貌似符合需求的模板,等到了ppt制作环节,才发现离我们的预期相距甚远,做到一半的ppt如何换模板呢? 想要在中途更换ppt模板,…

0基础入门linux文件系统

目录 文件系统简介 1. 文件系统类型 2. 文件系统结构 3. 文件系统的主要功能 4. 文件系统的使用 5. 文件系统的维护 6. 注意事项 简单举例 机械硬盘 物理结构介绍​编辑 CHS寻址 逻辑结构介绍 LBA寻址法 文件系统与磁盘管理 Boot Block Data block inode block…

2024年meme币走势分析:最后两个月的市场趋势与机会 #交易所#dapp#KOL社区合作

2024年即将步入尾声,meme币市场经历了显著的波动。对于加密市场来说,年底的走势尤为关键,尤其是meme币这种受市场情绪影响较大的加密资产。本文将从市场环境、宏观经济因素、投资者情绪、技术分析等方面分析meme币在2024年最后两个月的潜在走…

Cpp多态机制的深入理解(20)

文章目录 前言一、多态的概念二、多态的定义与实现两个必要条件虚函数虚函数的重写重写的三个例外override 和 final重载、重写(覆盖)、重定义(隐藏) 三、抽象类概念接口继承和实现继承 四、多态的原理虚表和虚表指针虚函数调用过程动态绑定与静态绑定 五、那...那单继承甚至多…

.net core 接口,动态接收各类型请求的参数

[HttpPost] public async Task<IActionResult> testpost([FromForm] object info) { //Postman工具测试结果&#xff1a; //FromBody,Postman的body只有rawjson时才进的来 //参数为空时&#xff0c;Body(form-data、x-www-form-urlencoded)解析到的数据也有所…

高清解压视频素材从哪儿下载?推荐5个高清推文素材资源网站

做抖音小说推文&#xff0c;哪里找爆款素材&#xff1f;作为一名从业多年的视频剪辑师&#xff0c;今天就来给大家揭秘可以下载爆款推文视频素材的网站&#xff0c;如果你也在苦苦找寻找&#xff0c;赶紧进来看看吧&#xff5e; 1. 稻虎网 首先是稻虎网&#xff0c;作为国内顶…

Python的全局锁GIL解析

Python的全局锁&#xff08;GIL&#xff09;是 CPython 解释器实现中的一个机制&#xff0c;用来确保任何时候只有一个线程执行 Python 字节码。这一机制存在于 CPython 中&#xff0c;主要是为了确保线程操作中的数据一致性&#xff0c;但也因此限制了多线程的并行执行效率。尤…