CODEWITHSUNDEEP
angularprogressive-web-apps
Jakub Matwiejew
Jakub Matwiejew

Reputation: 107

Angular 6 - no manifest was fetched

I'm trying to use a Service worker in my app.

I've added @angular/pwa, registered the service worker:

if ('serviceWorker' in navigator) {
    navigator.serviceWorker.register('/ngsw-worker.js', {
        scope: '/'
    }).then((registration) => {
        console.log("Service worker OK!")
    });
}

When i run Google Lighthouse on my local everything work perfect, and the site works in online mode, but whednI upload my app to server I recive an error in Lighthouse:

No manifest was fetched.

Do I use a wrong path?

manifest.json:
"start_url": "/index.html",

Upvotes: 4

Views: 4746

Answers (3)

Matthew Webster
Matthew Webster

Reputation: 21

For me putting the manifest at the top section of the head tag did it. I was loading scripts embed scripts from Facebook and Twitter, and angular had placed the at the bottom of head tag. Moving it above the scripts section somehow fixed it.

Upvotes: 1

KhoPhi
KhoPhi

Reputation: 9517

After adding the @angular/pwa, double check these:

1.In your angular.json file, under assets, add the manifest.json, like below

        "assets": [
          "src/favicon.ico",
          "src/assets",
          "src/manifest.json"
        ],

2.Your manifest.json file should be in the src/ directory, so src/manifest.json

3 Then in your ngsw-config.json file, you should have this:

  "files": [
    "/favicon.ico",
    "/index.html",
    "/manifest.json"
  ],

Do the three steps above, and you're good to go.

Upvotes: 6

abraham
abraham

Reputation: 47833

That error means that your index.html file doesn't tell browsers about the manifest. Add:

<link rel="manifest" href="manifest.json">

Upvotes: 7

Related Questions