PWA InjectManifest 工作箱控制台/调试输出突然禁用（Vue.js / Quasar Framework）

Question

我正在使用 Vue.js / Quasar Framework 构建 PWA，并且最近添加了 PWA 功能。我将“workboxPluginMode”属性更改为“InjectManifest”，起初 Workbox 按预期给了我调试/控制台。此外，“custom-service-worker.js”肯定会被进程接收，因为当我删除此行时它会显示错误：

precacheAndRoute(self.__WB_MANIFEST)

所以文件被识别并积极使用定义的缓存策略（我认为），但它不会再向我提供任何调试信息或控制台上的 console.log。我真的不知道我做了什么来做到这一点。

我的“自定义服务-worker.js”看起来像这样：

import { precacheAndRoute } from 'workbox-precaching'
import { registerRoute } from 'workbox-routing'
import { StaleWhileRevalidate } from 'workbox-strategies'

console.log('custom service worker active')

// Use with precache injection

precacheAndRoute(self.__WB_MANIFEST)

// Caching strategies

registerRoute(
    ({url}) => {
        console.log(url)
        // url.pathname.startsWith('/images')
    },
    new StaleWhileRevalidate()
);

self.addEventListener('fetch', function(event) {
    console.log(event)
    event.respondWith(fetch(event.request));
})

Answer 1

我不知道为什么，但 workbox 的控制台调试输出只显示在我的默认浏览器 (Vivaldi) 中。我想在纯 Chromium 上工作，因为我无法使用 Vivaldi 安装我的 PWA（没有弹出安装提示），但现在也可以。对此没有任何解释，但我猜这是 PWA 开发，它就是这样。不管怎样，我的问题已经解决了。

PWA InjectManifest 工作箱控制台/调试输出突然禁用（Vue.js / Quasar Framework）

PWA InjectManifest workbox console / debug output suddenly disabled (Vue.js / Quasar Framework)

vue.js

progressive-web-apps

workbox

quasar-framework