在Webpack之前,我总是依赖于以下模式来进行"缓存清除":
<script src="foo.js?cacheBust=12345" />
Run Code Online (Sandbox Code Playgroud)
哪个12345是服务器在每个构建时为我生成的标记(它可能是Git哈希,尽管在我的情况下它不是).
有了Webpack,我现在有两个文件:build.js和chunk.1.js.由于我使用正常的脚本标记带来第一个,我可以使用上面的模式:
<script src="build.js?cacheBust=12345" />
Run Code Online (Sandbox Code Playgroud)
但是,此时build.js会进行提取chunk.1.js,并且当它执行时,它不包括缓存无效的后缀.
我想让Webpack自动附加?cacheBust=12345,但我不知道12345构建时的部分,所以我不能把它包含在我的webpack.config.相反,我必须等到HTML页面被评估,此时我从服务器获取令牌.
所以,我的问题是,有没有办法让Webpack查看用于获取初始文件的参数(例如.?cacheBust=12345)并在获取其他文件时附加相同的参数?
我刚刚部署了一个非常基本的 React 应用程序,该应用程序是我使用它创建的create-react-app,然后构建了该应用程序并通过 Firebase CLI 进行了部署。当我更改应用程序中的某些内容然后再次构建并部署它时,刷新页面时无法在网站上看到更改。经过一番故障排除后,我发现这是一个缓存问题,浏览器只使用旧版本的文件,而不是重新加载新版本。这是有道理的,因为当我清除缓存(或以隐身模式打开窗口)时,我看到了我所做的更改。
我的问题是这在现实世界的应用程序中如何工作?您不能期望或依赖用户清除其缓存。