@angular/service-worker静默失败

Question

我已经在几个项目中成功地使用了@angular/service-worker模块，但在我最新的项目中遇到了一个似乎无法调试的静默失败问题。我的配置和设置与其他项目相同，并且输出的构建(通过CLI v1.6.2)似乎是正确的：

dist (partial)

我最初的想法是我的环境变量有问题，所以我检查了日志以确保enabled在构建后是true的，甚至为了测试在所有环境中都硬编码了它：

ServiceWorkerModule.register('/ngsw-worker.js', {
  enabled: true
})

然而，当我运行应用程序时，无论是在本地使用http-server，还是在启用了prod模式的开发或qa环境中，开发工具中都没有注册服务工作者，控制台中也没有错误或警告：

service worker tab

在这种情况下，有没有人知道是什么导致了静默失败？我绞尽脑汁，将有效的解决方案与此进行比较，但似乎无法提出解决方案。另外，有没有办法进一步调试这种类型的场景？

提前感谢您的帮助！

Answer 1

您可以在main.ts文件中使用此解决方法：

​

platformBrowserDynamic().bootstrapModule(AppModule).then(() => {
  if ('serviceWorker' in navigator && environment.production) {
    navigator.serviceWorker.register('/ngsw-worker.js');
  }
}).catch(err => console.log(err));

​

正如here所解释的，您的代码库或依赖项中可能存在一些问题。在angular团队给出官方解决方案之前，我更倾向于使用变通解决方案。