Site cannot be installed: no matching service worker detected

Just in case this happens to anyone else using Angular8+. You may need to change your registration strategy to:

ServiceWorkerModule.register('ngsw-worker.js', { enabled: environment.production, registrationStrategy: 'registerImmediately' }),

By default, this is set to registerWhenStable, which is when there are no pending tasks, things like setTimeout(), etc. By changing it to registerImmediately, it will register your service worker as soon as it possibly can.

Just thought I'd share this and add it here, as this lost me a few days trying to work it out.

The create react app service worker only goes into effect in production, so build it and serve it locally to test that the service worker is working properly.

Install serve npm first, if it isn't already: npm i serve -g

Then...

npm run build

serve -s build

It's also likely that once the service worker registers successully, but something like beforeinstallprompt might not get called. If that's the case, publish the app using a host like firebase, which will serve the site over https, then try the beforeinstallprompt there.

Try making the following changes:

• In manifest.json, the start_url and scope is set like this (or based on your preference):

    "start_url": "/",
    "scope": "."  
  

• The sw.js file is located at project root, taking start_url as reference.

Place the service worker script file at the root of your website and set start_url to /, or place it wherever you want and use the scope property and the Service-Worker-Allowed HTTP header as in my other answer.