ReactJS修改后页面无变化，Spring Boot项目npm start不生效

• 强制刷新浏览器缓存

  • 按Ctrl+Shift+R（Windows/Linux）或Cmd+Shift+R（Mac）跳过缓存加载最新内容；也可以打开开发者工具（F12），在Network面板勾选「Disable cache」，保持工具开启状态下刷新页面。

• 确认React热重载是否触发

  • 查看npm start的终端输出，若代码修改后无编译日志，说明热重载未工作：
    • 检查项目根目录的.env文件，若有FAST_REFRESH=false，改为FAST_REFRESH=true；
    • 确认修改的文件在src目录内，create-react-app默认仅监听该目录下的文件变更。

• 核对访问端口与资源来源

  • 确保浏览器地址栏的端口是React开发服务器端口（默认3000），而非Spring Boot的端口（如8080）。若通过Spring Boot代理访问React，需临时关闭Spring Boot的静态资源缓存配置（比如注释掉spring.web.resources.cache.cachecontrol.max-age相关设置）。

• 验证代码是否实际执行

  • 在修改的按钮点击事件中添加console.log('跳转至github')，打开浏览器控制台点击按钮，若无输出，说明代码未被执行：
    • 检查组件是否通过setState（类组件）或useState/useReducer（函数组件）触发重渲染；
    • 确认修改的是当前页面加载的目标组件，而非其他同名文件。

• 重置React开发服务器缓存

  • 停止npm start，删除项目根目录下的node_modules/.cache文件夹，重新执行npm start。

• 检查IDE自动保存设置

  • 确认IDE（如VS Code）的「Auto Save」已开启，确保修改后的代码实时保存到磁盘。

内容的提问来源于stack exchange，提问作者Pushkar