工作箱：在构建项目

Question

我使用Vuejs并使用workbox-webpack-plugin以使我的网站脱机，我想要缓存一个文件夹，其中包含我的所有文件（3个文件），如下图所示，但是当我构建我的网站时项目（使用Laravel-mix）。 main.js（包含Vue的所有内容）无法在service-woker.js中缓存。我尝试了一些方法来解决这个问题，但那些方法并没有奏效。 有没有人面对这个问题，你有什么解决方案，非常感谢！

- ＆GT;＆GT;

Answer 1

为什么要手动处理？即使您可以使用

缓存所有静态资产

workbox.precaching.precacheAndRoute(self.__precacheManifest || []);

对于动态请求，请使用带策略的路由： -

workbox.routing.registerRoute('end point url', workbox.strategies.networkFirst({
cacheName: 'cache-name'
}));

Answer 2

编辑：经过很长时间没有回头看这个问题，github上有一个人帮助我找出了原因。

这是因为库调用maximumFileSizeToCacheInBytes中有一个属性默认设置为2MB，这意味着它将仅缓存小于或等于2MB的文件，而某些内置文件大于该大小。因此，您只需增加maximumFileSizeToCacheInBytes即可解决此问题。