2022 年如何为每个 React App 部署自动强制刷新浏览器缓存?

Kel*_*yer 9 reactjs

默认情况下,当部署 React 应用程序时,即使在新版本中进行了更改,也会显示缓存的版本。这需要最终用户硬刷新其页面 ( Ctrl+F5) 以查看新的更改。让用户每次都这样做是不可行的。

随着软件的不断升级和发展速度,有许多不同的方法可以实现这一点。然而,由于每年采用的做法不同,答案差异很大。

2022 年实现这一目标的最佳实践是什么?有没有一种简短而简单的方法可以做到这一点?

编辑:我正在使用 create-react-app 项目模板。

小智 1

这与浏览器缓存旧页面而不是 React 有关,为了避免这种情况,您需要像您提到的那样强制刷新或使用某种不同的文件命名更改构建策略,这可以通过在此处使用 webpack 缓存来完成 https : //webpack.js.org/guides/caching/

这样,您的脚本在每次新部署时都会有不同的名称,并且浏览器在获取 index.html 时必须重新加载新脚本。

  • 如果这种情况已经发生,但客户端浏览器仍在缓存并运行旧脚本怎么办? (3认同)