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'

效果:

相关推荐
90后的晨仔1 分钟前
ArkTS 语言中的number和Number区别是什么?
前端·harmonyos
菜鸡爱上编程13 分钟前
React16,17,18,19更新对比
前端·javascript·reactjs·react
我命由我1234520 分钟前
VSCode - VSCode 转换英文字母的大小写
开发语言·javascript·ide·vscode·编辑器·html·软件工具
陈龙龙的陈龙龙42 分钟前
uniapp 金额处理组件
前端·javascript·uni-app
我命由我123451 小时前
VSCode - VSCode 让未被编辑的标签页不被自动关闭
前端·javascript·ide·vscode·编辑器·html·js
Jimmy1 小时前
CSS 中操作移动,缩放和旋转
前端·css·react.js
layman05281 小时前
openeuler 虚拟机:Nginx 日志分析脚本
前端·javascript·nginx
curdcv_po1 小时前
ts 非空 断言, 后缀加感叹号!,有话要说!!!
前端
烛阴2 小时前
快速上手Axios:前端开发者必备技能
前端·javascript
究极无敌暴龙战神X2 小时前
Vite中定义@软链接
前端