React如何配置env环境变量

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

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

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

【1】PUBLIC_URL

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

官方描述:

javascript 复制代码
// 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
);

配置方式:

bash 复制代码
PUBLIC_URL = '/zyk'

效果:

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

【2】BUILD_PATH

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

配置方式:

bash 复制代码
BUILD_PATH = 'dist'

效果:

相关推荐
紫_龙几秒前
最新版vue3+TypeScript开发入门到实战教程之生命周期函数
前端·javascript·typescript
小江的记录本9 分钟前
【反射】Java反射 全方位知识体系(附 应用场景 + 《八股文常考面试题》)
java·开发语言·前端·后端·python·spring·面试
孟陬9 分钟前
国外技术周刊 #4:这38条阅读法则改变了我的人生、男人似乎只追求四件事……
前端·人工智能·后端
工边页字11 分钟前
cursor接上figma mcp ,图形图像模式傻瓜式教学(包教包会版)
前端·人工智能·ai编程
callJJ12 分钟前
Ant Design Table 批量操作踩坑总结 —— 从三个 Bug 看前端表格开发的共性问题
java·前端·经验分享·bug·管理系统
我去流水了19 分钟前
【独家免费】【亲测】在linux下嵌入式linux的web http服务【Get、Post】,移植mongoose,post上传文件
linux·运维·前端
Mintopia23 分钟前
世界头部大厂的研发如何使用 AI-Coding?
前端
wuhen_n23 分钟前
响应式图片的工程化实践:srcset与picture
前端·javascript·vue.js
学博成25 分钟前
centos7.9 安装 Firefox
前端·firefox
专注VB编程开发20年25 分钟前
VS2026调试TS用的解析/运行引擎:确实是 ChakraCore.dll(微软自研 JS 引擎)
开发语言·javascript·microsoft