React如何配置env环境变量

React版本: "react": "^18.2.0"

1、在package.json平级目录下创建'.env'文件

2、在‘.env’文件里配置环境变量

【1】PUBLIC_URL

描述:编译时文件的base-href

官方描述:

// We use `PUBLIC_URL` environment variable or "homepage" field to infer
// "public path" at which the app is served.
// webpack needs to know it to put the right <script> hrefs into HTML even in
// single-page apps that may serve index.html for nested URLs like /todos/42.
// We can't use a relative path in HTML because we don't want to load something
// like /todos/42/static/js/bundle.7289d.js. We have to know the root.
const publicUrlOrPath = getPublicUrlOrPath(process.env.NODE_ENV === 'development',require(resolveApp('package.json')).homepage,process.env.PUBLIC_URL
);

配置方式:

PUBLIC_URL = '/zyk'

效果:

编译后的文件都增加了‘/zyk’前缀

 

【2】BUILD_PATH

描述:编译后文件夹名称,默认是‘build’

配置方式:

BUILD_PATH = 'dist'

效果:

 

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

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

相关文章

从KM到Cure Models:常用生存分析方法的优缺点

一、引言 生存分析是一种用于研究个体生命长度或事件发生时间的统计方法。在许多领域中&#xff0c;如医学、社会学、经济学和工程学等&#xff0c;生存分析被广泛应用于分析个体的生存时间&#xff0c;并研究相关因素对生存时间的影响。通过生存分析&#xff0c;我们可以评估特…

交换排序——选择排序和冒泡排序的区别是什么?

今天重温一下算法&#xff0c;其实刚开始我觉得冒泡排序和选择排序是一样的&#xff0c;因为他们排序过程中都是通过相邻的数据比较找到最小/最大的数据&#xff0c;通过不断思考和学习才明白&#xff0c;两者还是有区别的。 冒泡排序 概念 冒泡排序(Bubble Sort)&#xff0…

SpringBoot使用thymeleaf模版引擎配置自定义错误页面

1、要在Spring Boot项目中配置自定义的错误页面&#xff0c;你可以遵循以下步骤&#xff1a; 1.1、pom.xml引入thymeleaf <dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-thymeleaf</artifactId><…

【正版系统】2023热门短剧SAAS版开源 | 小程序+APP+公众号H5

当我们在刷百度、D音、K手等各种新闻或短视频时经常会刷到剧情很有吸引力的短剧广告&#xff0c;我们点击广告链接即可进入短剧小程序&#xff0c;小程序运营者通过先免费看几集为诱耳然后在情节高潮时弹出充值或开VIP会员才能继续看的模式来赚钱&#xff0c;以超级赘婿、乡村小…

VS Code中C++程序的调试(Debug)功能

有一个.vscode文件&#xff0c;存放当前工作区相关配置文件的目录。 launch.json {"version": "0.2.0","configurations": [{"name": "gcc.exe - 生成和调试活动文件", // 该调试任务的名字&#xff0c;启动调试时会在待…

TCP/IP 下的计算机网络江湖

〇、引言 在当今数字化时代,计算机网络宛如广袤江湖,涵盖着五大门派:物理层、数据链路层、网络层、传输层和应用层。每个门派独具技能,共同构筑着现代网络的框架。物理层宛如江湖基石,将比特流传输;数据链路层如武林传承,组织数据帧传递;网络层则像导航大师,寻找传送路…

使用阿里云服务器搭建PostgreSQL主从架构图文流程

阿里云百科分享使用阿里云服务器搭建PostgreSQL主从架构图文流程&#xff0c;PostgreSQL被业界誉为最先进的开源数据库&#xff0c;支持NoSQL数据类型&#xff08;JSON/XML/hstore&#xff09;。本文档介绍在CentOS 7操作系统的ECS实例上搭建PostgreSQL主从架构的操作步骤。 目…

【Linux操作系统】文件描述符fd

&#x1f525;&#x1f525; 欢迎来到小林的博客&#xff01;&#xff01;       &#x1f6f0;️博客主页&#xff1a;✈️林 子       &#x1f6f0;️博客专栏&#xff1a;✈️ Linux之路       &#x1f6f0;️社区 :✈️ 进步学堂       &#x1…

python单元测试框架(测试固件、批量执行)

python测试框架 在Python语言中应用最广泛的单元测试框架是unittest和pytest,unittest属于标准库&#xff0c;只要安装了Python解释器后就可以直接导入使用了,pytest是第三方的库&#xff0c;需要单独的安装。 1.白盒测试原理 在软件架构的层面来说&#xff0c;测试最核心的…

Kotlin入门:变量和函数——02

目录 一、Kotlin 基本数据类型 ​编辑 二、变量 val 关键字&#xff1a; var 关键字: 类型推断: 可空类型: 三、函数 基本函数语法&#xff1a; 单表达式函数&#xff1a; 默认参数值&#xff1a; 命名参数&#xff1a; 一、Kotlin 基本数据类型 Kotlin 的基本数…

vue数据更新table内容不更新解决方法

场景&#xff1a; table组件绑定的数据变化时&#xff0c;页面没有重新渲染&#xff0c;常见于子组件中使用table组件 原理&#xff1a; 创建实例时 数组在vue中没有被监听到&#xff0c;属于非响应式数据&#xff0c;数组的下标变化无法监听到 解决方式&#xff1a; <e…

SpringSecurity如何放行资源

SpringSecurity配置放行资源 permitAll配置实例 EnableWebSecurity public class SecurityConfig extends WebSecurityConfigurerAdapter {Overridepublic void configure(HttpSecurity http) throws Exception {http.authorizeRequests().antMatchers("/css/**", …

数据库事务ACID介绍

一、ACID简介 ACID&#xff0c;是指数据库管理系统&#xff08;DBMS&#xff09;在增删改数据的的过程中&#xff0c;为保证事务&#xff08;transaction&#xff09;的准确性&#xff0c;可靠性等&#xff0c;所必须具备的四个特性&#xff1a;原子性&#xff08;atomicity&a…

【MFC】09.MFC视图-笔记

MFC视图窗口&#xff1a;CView类 显示数据/画面 我们之前的绘图消息&#xff0c;都是在框架类上画出来的 视图窗口就覆盖在框架窗口上 视图窗口本质上也是窗口&#xff0c;只是和框架窗口风格不同 CView类也继承于CWnd类 CView也能处理消息&#xff0c;因为它继承于CWnd类…

关于selenium 元素定位的浅度解析

一、By类单一属性定位 元素名称 描述 Webdriver API id id属性 driver.find_element(By.ID, "id属性值") name name属性 driver.find_element(By.NAME, "name属性值") class_name class属性 driver.find_element(By.CLASS_NAME, "class_na…

25考研:跨专业考研难吗?

25考研&#xff1a;跨专业考研难吗&#xff1f; 嘉兴校址&#xff1a;嘉兴市南湖区中山东路205号嘉华广场4楼 &#xff08;建国珠宝城旁&#xff09;上元教育 海宁校址&#xff1a;海宁市西山路832号金贸大厦11楼1101号上元教育 桐乡校址&#xff1a;桐乡市东悦路吾悦广场156号…

MAUI+Blazor:隐藏标题栏和问题

文章目录 前言相关文章代码问题有必要解决吗&#xff1f; 前言 最近在研究MAUIBlazor开发&#xff0c;发现一个问题&#xff0c;原生的的标题栏实在是太丑了。 相关文章 MAUI桌面端标题栏设置和窗口调整 MAUI Windows How to completely hide the TitleBar? #15142 MAUI …

Chrome开发者工具介绍

Chrome开发者工具介绍 前言1 打开DevTools2 命令菜单3 Elements面板ConsoleJavaScript调试Network 前言 Chrome开发者工具是谷歌浏览器自带的一款开发者工具&#xff0c;它可以给开发者带来很大的便利。常用的开发者工具面板主要包含Elements面板、Console面板、Sources面板、…

数据结构——时间复杂度和空间复杂度

1.算法效率 2.时间复杂度 3.空间复杂度 4. 常见时间复杂度以及复杂度oj练习 1.算法效率 1.1 如何衡量一个算法的好坏 如何衡量一个算法的好坏呢&#xff1f;比如对于以下斐波那契数的计算 long long Fib(int N) { if(N < 3) return 1; return Fib(N-1) Fib(N-2); }我们看到…

2023 互联网大厂薪资大比拼

最近整理了33家互联网大厂的薪资情况。可以看出来&#xff0c;大部分互联网大厂薪资还是很不错的&#xff0c;腾讯、阿里、美团、百度等大厂平均月薪超过30k&#xff0c;其他互联网大厂平均月薪也都在25k以上。01020304050607080910111213141516171819202122232425262728293031…