Reactjs 预缓存内容不会从缓存加载

在我的React SSR应用程序中，我实现了服务工作者（通过Workbox）。 很好用。每次当我更改某段代码、再次重建、运行服务器、进入浏览器时，我都会看到缓存已成功更新

但有一件事我不能理解。当我从本地服务器删除某些资源（js或css）并尝试在浏览器中执行某些操作（调用该资源）时，我收到一个chunk错误，该错误表示该文件不可用

主要问题是如果该资产已在缓存中，则不应从该缓存加载该资产，或者我遗漏了什么

我使用的组件是

节点/express（用于服务器）

@可加载/组件（用于代码拆分），结合网页包

谷歌工作盒插件

//我的sw.js文件
从“workbox core”导入{skipWaiting}；
从“工作盒预处理”导入{precacheAndRoute}；
声明const self:Window&ServiceWorkerGlobalScope；
预开舱单（自开舱单）；
skipWaiting（）；
//我的工作盒设置
const serviceWorkerRegistration=async（）：Promise=>{
const{Workbox}=等待导入（'Workbox-window'）；
const wb=new Workbox（'./service worker.js'）；
wb.addEventListener（'已激活'，（事件：任意）=>{
if（event.isExternal）{
window.location.reload（）；
}
});
寄存器（）；
};

这是由于您在服务人员内部使用了

skipWaiting（）

。当

waiting

service worker激活时，它将删除所有不再与新service worker部署关联的过期预缓存条目

这两个密切相关的答案以及一个演示文稿中有更多的背景信息：

// my sw.js file
import { skipWaiting } from 'workbox-core';
import { precacheAndRoute } from 'workbox-precaching';

declare const self: Window & ServiceWorkerGlobalScope;

precacheAndRoute(self.__WB_MANIFEST);

skipWaiting();

// my workbox setup
const serviceWorkerRegistration = async (): Promise<void> => {
  const { Workbox } = await import('workbox-window');
  const wb = new Workbox('./service-worker.js');

  wb.addEventListener('activated', (event: any) => {
    if (event.isExternal) {
      window.location.reload();
    }
  });

  wb.register();
};