Angular service-worker scope encountered an error during installation

I am trying to use the angular service worker but I get an error when trying to use it.

Those are my versions:

Angular CLI: 15.2.0
Node: 16.18.1
Package Manager: npm 8.19.2
OS: linux x64

Angular: 15.2.0
... animations, cdk, cli, common, compiler, compiler-cli, core
... forms, localize, material, platform-browser
... platform-browser-dynamic, router, service-worker

Package                         Version
---------------------------------------------------------
@angular-devkit/architect       0.1502.0
@angular-devkit/build-angular   15.2.0
@angular-devkit/core            15.2.0
@angular-devkit/schematics      15.2.0
@schematics/angular             15.2.0
rxjs                            6.6.7
typescript                      4.8.4

When I try to use the swPush in a function:

  subscribeToNotifications() {
    console.log('subscribeToNotifications: ');
    this.swPush.requestSubscription({
      serverPublicKey: VAPID.publicKey
    })
      .then(sub => {
        console.log('User accepts: ', sub);
        this.alertService.success('Your browser will show up our notifications', AlertOptions.options)
      })
      .catch(err => console.error("Could not subscribe to notifications", err));
  }

Then I get this error:

Service worker registration failed with: TypeError: ServiceWorker script at http://localhost:<port>/<out-path>/ngsw-worker.js for scope http://localhost:<port>/<out-path>/ encountered an error during installation.

I have follow the official guide posted here, but I can get this to work.

The ngsw.json and the ngsw-worker.js are generated in the path set in the angular.json > outputPath. Lets called it out-path.

The files angular.json and package.json seem to be overwritten correctly, and my app.module.ts looks like this:

...
        OverlayModule,
        ServiceWorkerModule.register('/<out-path>/ngsw-worker.js', {
          enabled: true, // should be environment.production
          // Register the ServiceWorker as soon as the application is stable
          // or after 30 seconds (whichever comes first).
          registrationStrategy: 'registerWhenStable:30000'
        })
...

All configuration files, seems to be fine, but I cannot get the service-worker register for some reason.

I am launching the app with ng serve --proxy-config proxy.conf.js. I would like to run this in Dev mode, but if someone knows how to get this work in production, it would be fine aswell.

QUESTION UPDATED

• Upgrade angular from v13 to the latest v15.0.2.
• Added some improvements to the question
• Added a bounty

from Angular service-worker scope encountered an error during installation