不会被预缓存。配置 MaximumFileSizeToCacheInBytes 以更改此限制 (PWA)

Question

帮我。运行“npm run dev”警告后出现问题：

css/app.css 中的警告为 4.13 MB，并且不会被预缓存。配置 MaximumFileSizeToCacheInBytes 以更改此限制。

警告是什么意思？谁能解释一下吗？以及如何解决呢？谢谢好心人^^

Answer 1

sw-precache 检查 Service Worker 在注册期间将立即缓存（预缓存）哪些文件。在构建期间 sw-precache 发现 app.css 是应用程序的一部分，并希望将其添加到预缓存文件列表中。但是您的 app.css 有 4.13 MB 大，这对于默认配置来说太大了。

第一个建议是：检查您是否真的需要那么多 CSS，以及是否可以减小文件大小。

如果这不可能，您可以调整 MaximumFileSizeToCacheInBytes：

我不确定你是否使用 sw-precache，因为它已经过时了，你应该改用 workbox-build。

对于工作箱构建，通过设置MaximumFileSizeToCacheInBytes来使用以下配置：

// build-sw.js

import {generateSW} from 'workbox-build';

generateSW({
  swDest: './dist/sw.js',
  maximumFileSizeToCacheInBytes: <yourMaxFileSizeInBytesGoesHere>
  .....
});