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'

效果:

相关推荐
丷丩3 分钟前
MapLibre GL JS第11课:获取鼠标指针坐标
前端·javascript·gis·地图·mapbox·maplibre gl js
代码AI弗森10 分钟前
前端周刊第 467 期[特殊字符] 本期精选目录
前端
随便的名字11 分钟前
前端路由的底层逻辑:URL 中 # 和 ? 的区别与关系详解
前端
kongba00713 分钟前
ttyd Web终端安装指南(OpenCloudOS 9)
linux·前端
zhoumeina9913 分钟前
前端串行合成流程 + 每张图上传接口
前端·状态模式
风骏时光牛马15 分钟前
Swift 基于MVVM架构实现完整列表数据展示与交互功能实战案例
前端
就叫_这个吧24 分钟前
JavaScript基础数据类型、运算符、数组、函数的定义及DOM方式应用
开发语言·前端·javascript
作业逆流成河31 分钟前
别再一次性重构枚举了:如何把一个真实后台项目的状态字典,渐进式迁移到enum-plus?
前端·javascript·开源
暗不需求31 分钟前
React 性能优化秘籍:深入理解 `useMemo` 与 `useCallback`
前端·react.js·面试
专注VB编程开发20年38 分钟前
我制作excel工作簿的选项卡,发给deep seek, 昨天修改了一天
前端·vue.js·excel