Vue CLI 4 - 清单中的 PWA 插件预缓存无法获取 index.html 且未注册服务工作者

Question

将 Vue CLI 3 更新到 CLI 4 后，service worker 停止注册。

环境：

Firebase hosting, 

"vue": "^2.6.10",
"vuex": "^3.1.1",
"firebase": "^7.2.3",
"vuetify": "^2.1.9",
"core-js": "^3.3.6",
...
 "@vue/cli-plugin-pwa": "^4.0.5",

我看到失败发生在 /index.html 页面上生成的预缓存清单文件上：

// precache-manifest.326028534d4ff40f4be7a15fc11e84c6.js
...
 {
    "revision": "7eeb3269c508ac628b85ccfaa20744ab",
    "url": "/index.html"
  },
...

我试图从 workboxOptions 中禁用 'skipWaiting'，因为我使用延迟加载路由，如文档所述，但它没有做任何事情：

pwa:{
  workboxOptions: {
    skipWaiting: false,
  }
}

网络选项卡中的错误是：

如果我手动注释掉已编译的 precache-manifest 文件中的行，那么 service worker 可以正常工作。没看懂。

Answer 1

原来问题出在firebase.json的配置上，在托管部分，我启用了"cleanUrls": true。删除它会使 service worker 再次注册。

这是现在的样子，默认设置：

 "hosting": {
    "public": "dist",
    "ignore": [
      "firebase.json",
      "**/.*",
      "**/node_modules/**"
    ],
    "rewrites": [
      {
        "source": "**",
        "destination": "/index.html"
      }
    ]
  },

Vue CLI 4 - 清单中的 PWA 插件预缓存无法获取 index.html 且未注册服务工作者

Vue CLI 4 - PWA plugin pre-cache in manifest fails to fetch index.html and doesn't register the service worker

vue.js

progressive-web-apps

vue-cli

workbox