无法使用角度cli以角度注册服务工作者

Question

I am trying to covert my angular app into a PWA so tried to add service worker using npm install @angular/service-worker --save and ng add @angular/pwa then after that I build the app in production mode using ng build --prod and serve the app using ng serve --open but there in console --> application tab I got manifest.json running fine but service worker is not getting registered and showing nothing in service worker section.

Here is my src/index.html
Here is my src/main.ts
Here is my angular.json
Here is my ngsw-config.json
Here is my src/app/app.module.ts

Answer 1

Service Worker run ONLY ON HTTPS domain .. if you test it on localhost it can't work .. maybe try to run your localhost site with angular cli with:

ng serve --prod --ssl=true

Hope it helps you

try also in the main.ts file :

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

and double check your dist folder for all necessary files :

ngsw-worker.js

and

 ngsw.json 

as you see in screentshot