多个self.__WB_MANIFEST实例
(与这个问题有关)
我使用类星体v2.0.0-beta.5和“webpack plugin”："^5.1.4"，下面是pwa教程。我现在正在使用workboxPluginMode：'InjectManifest‘在quasar.conf.js中处理服务工作者部分。我的定制服务-worker.js只是：
import { precacheAndRoute } from 'workbox-precaching'
precacheAndRoute(self.__WB_MANIFEST)加载pwa时会出现以下错误
非数组:传入'workbox-precaching.PrecacheController.addToCacheList()‘的参数’条目‘必须是数组。
我已经更新为Workbox：npm install --save-dev workbox-webpack-plugin@^6.1.0的最新版本，以查看它是否会产生影响，现在我在quasar dev -m pwa中得到了以下错误
在您的SW源中找到了多个self.__WB_MANIFEST实例。只包括一次。有关更多信息，请参见GoogleChrome/workbox#2681
问题是，如果不解决这个问题，我就无法调试不同的缓存策略。
平台(请填写以下信息)：类星体版本: v2.0.0-beta.5 @类星体/应用程序版本: v3.0.0-beta.7类星体模式: SPA SSR x PWA电子Cordova电容BEX测试: SPA x PWA电子Cordova电容BEX OS: windows 10节点: v14.15.1 NPM: 6.14.8 Yarn: 1.22.10浏览器: chrome (最新) iOS: Android: Android:iOS：
回答 2
Stack Overflow用户
发布于 2021-03-24 11:50:06
在服务工作人员文件中执行此操作。
if (process.env.NODE_ENV === 'production') {
precacheAndRoute(self.__WB_MANIFEST);
}Stack Overflow用户
发布于 2022-08-19 01:02:04
我解决了问题，只需将此代码添加到service-worker.js中即可。
precacheAndRoute(self.__WB_MANIFEST || []);
const { assets } = global.serviceWorkerOption;
let assetsToCache = [...assets, './'];
assetsToCache = assetsToCache.map((path) => {
return new URL(path, global.location).toString();
});
// When the service worker is first added to a computer.
self.addEventListener('install', (event) => {
// Perform install steps.
if (DEBUG) {
console.log('[SW] Install event');
}
// Add core website files to cache during serviceworker installation.
event.waitUntil(
global.caches
.open(CACHE_NAME)
.then((cache) => {
return cache.addAll(assetsToCache);
})
.then(() => {
if (DEBUG) {
console.log('Cached assets: main', assetsToCache);
}
})
.catch((error) => {
console.error(error);
throw error;
})
);
});
https://stackoverflow.com/questions/66230023
复制相似问题
腾讯云开发者
