【问题标题】:Loading a static asset that no longer exists (ChunkLoadError)加载不再存在的静态资产 (ChunkLoadError)
【发布时间】:2021-07-14 18:36:14
【问题描述】:

对我来说,这个问题首先在 Webpack 中表现为 ChunkLoadError。正如答案所解释的,它适用于在文件名中使用哈希标记资产并且甚至不特定于 Webpack 的所有场景。

使用 Webpack 进行代码拆分和根据需要延迟加载块。例如,假设它是一个宠物商店的应用程序。首次加载站点时,它会加载主页导航所需的所有 JS。当您浏览到不同的部分时,它会按需加载每个部分的代码。

因此,当您单击菜单中的“海龟”时,它会加载一个名为 turtles.abc123.js 的文件,其中包含所有与海龟相关的代码。 (“abc123”是用于缓存管理的哈希值。)

除了您在浏览时,我们发布了一个新版本,其中对海龟代码进行了一些更改,将 turtles.abc123.js 替换为 turtles.e1337b.js。当您单击海龟部分时,它会尝试加载 turtles.abc123.js一个不再存在的块,从而导致 ChunkLoadError

在我看来,解决这个问题的方法是不要删除旧的块文件。只要我们对每次发布都积累一组新的块文件感到满意,这不是问题。 我们很快就会得到数百个文件。 不一定是坏事,但让它无限制地继续下去似乎是不明智的。在某些时候磁盘空间会成为一个问题。

我的下一个想法是删除超过一周的文件,因为几乎不可能有人长时间保持登录状态并注销会刷新页面。

我看不到任何关于在Clean PluginWebpack's output.clean option 中保留文件一段时间的内容。这表明将文件保存在一段时间并不是一种常见的做法。

什么是常见的做法?每个人通常会选择不担心过时的发布问题或不担心累积文件的问题吗?还是有其他我没有考虑过的解决方案?

【问题讨论】:

  • 你的思路很扎实。我不担心积累文件。您绝对不想用新版本替换所有文件,从而破坏旧版本的用户,因为它会在某个时候发生。
  • 很难安全地自动删除。我不时将其视为手动过程。假设您删除了超过一个月的文件,以确保“安全”。但是一段时间过去了,你有一个好月没有发布新版本。现在最后一个版本被立即删除,让我们回到问题 #1,这可能会破坏最近加载应用程序的用户。您真的想要一种方式来说“从 ​​X 数量的构建中删除文件,但至少一个月前”。如果没有进一步的文件标记,这是不可能自动化的。所以我只是让他们在服务器上建立起来。
  • @CalebMiller 这是一个很好的观点,也是我正在寻找的答案。也许这个问题的措辞应该稍有不同。
  • 很高兴它有帮助!我没有写这个作为答案的主要原因是我不能为每个人回答,但也许它仍然应该是一个带有警告的答案。我会写出来的:)
  • 谢谢。我担心这个问题会被关闭,因为没有人可以代表所有人,但我找不到更好的表达方式。回想起来,真正的问题是“我不知道我不知道什么。我不知道什么?” :D 希望下一个搜索博客文章或详细解释此问题的内容的人会找到这个问题和答案。

标签: javascript webpack


【解决方案1】:

我不能代表所有人,但我已经发布了一些规模合理的网络应用程序,可以分享我的经验和想法。

简而言之:不要删除服务器上部署的文件,让它们累积。

更长的答案:

带有散列文件名(JS、CSS、图像等)的静态构建工件通常很小,而且空间很便宜!我认为最好的权衡是让这些文件累积在您的服务器上,以防止用户运行您的应用程序的陈旧版本出现任何问题。如果删除最后一个版本,迟早会给用户带来麻烦,这一般是不能接受的。

那么接下来的问题是:我什么时候可以开始清理旧文件?我当然不会让它们无限积累,对吧?好吧,一般来说我不认为这是个问题,但你可以每隔一段时间清理一次服务器(几个月,甚至一年一次都可以)。

问题是:很难安全地自动清理旧文件。假设在每次发布后,您决定自动删除超过一个月的文件,以确保“安全”。但是一段时间过去了,你一个月没有发布新版本。现在之前的版本被立即删除,让我们回到问题#1,这可能会破坏最近加载该应用程序的用户。您真的想要一种方式来说“从 ​​X 数量的构建中删除文件,但至少一个月前”。如果没有进一步的文件标记,这是不可能自动化的。所以就我个人而言,我只是让它们在服务器上建立起来,如果我觉得有必要,偶尔会手动清理它们。在这种情况下,“手动”仍然可以是一个脚本,但重点是它是手动运行的,而不是在每次发布之后。

您可以想象构建一个跟踪版本并完全自动化的系统,但该系统最终会有些固执己见,这就是为什么我认为没有一种标准的方式可以让每个人都这样做。

编辑:还有一点需要牢记。因为文件名是散列的,如果它们不更改同一个文件,可能会在很长一段时间内相关,可能是几年。这对于图像尤其常见。如果您的部署过程只上传新文件,那么您永远无法可靠地删除任何内容。但是,如果您总是从最新版本上传所有文件,在发生冲突的情况下覆盖服务器上已有的文件,那么您可以根据需要偶尔进行清理。

【讨论】:

    最近更新 更多