You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

Create React App的env.js配置中使用require.cache的作用是什么

该代码的作用是保证所有在env.js加载完成后引入的paths.js,都能读取到.env文件里的环境变量生成最新配置。

具体逻辑:

  • env.js的完整执行流程分为三步:
    1. 先引入paths.js获取基础路径,用来定位项目下的.env系列文件位置
    2. 删除paths.js的模块缓存
    3. 读取所有.env文件的变量,注入到process.env全局对象中
  • paths.js内部的路径生成逻辑依赖process.env中的变量(比如PUBLIC_URL这类用户自定义配置),如果不删除缓存,后续其他文件引入paths.js时,拿到的是环境变量注入前就初始化完成的旧版paths对象,里面的路径不会用到.env里的配置,不符合预期。

为什么你的测试没有看出差异:

你测试时用的env.js是删减版,缺少了「注入.env变量到process.env」的核心逻辑,两次引入paths.js时全局环境变量没有发生变化,自然输出完全一致。

你可以用下面的简化示例复现差异:

// paths.js 内容
module.exports = {
  publicPath: process.env.PUBLIC_URL || '/'
}

// env.js 简化版
const paths = require('./paths')
// 清除paths缓存
delete require.cache[require.resolve("./paths")];
// 模拟加载.env后注入环境变量的逻辑
process.env.PUBLIC_URL = '/my-app'
module.exports = { /* env相关导出 */ }

执行测试代码:

const pathsBeforeEnv = require('./paths')
console.log(pathsBeforeEnv.publicPath) // 输出:/

require('./env')

const pathsAfterEnv = require('./paths')
console.log(pathsAfterEnv.publicPath) // 输出:/my-app

内容的提问来源于stack exchange,提问作者jwkoo

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.10.06 19:15:00