Progressive Web App - No Manifest Detected

Question

I am building a Progressive Web App and would like to add a manifest file. I have built one and added a link to it on the home page but I get a message that says, "No manifest detected". Here is what the head looks like in index.html:

<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="application-name" content="app">
<meta name="apple-mobile-web-app-title" content="app">
<meta name="theme-color" content="#233b69">
<meta name="msapplication-navbutton-color" content="#233b69">
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
<meta name="msapplication-starturl" content="/index.html">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

<link rel="icon" type="image/png" sizes="192x192" href="assets/img/app.png">
<link rel="apple-touch-icon" type="image/png" sizes="192x192" href="assets/img/app.png">

<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="viewport" content="width=device-width">
<meta name="mobile-web-app-capable" content="yes">

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

Here is what the manifest.json file looks like:

{
  "name": "someApp",
  "short_name": "app",
  "lang": "en-US",
  "start_url": "/index.html",
  "display": "standalone",
  "theme_color": "#233b69",
  "icons": [
{
  "src": "assets/img/app.png",
  "sizes": "192x192",
  "type": "image/png"
}
  ]
}

Answer 1

It sounds like the manifest file and the index.html is not in the same path or not linked correctly. If it is and still not working, try changing manifest link like below (added "/" in the href),

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

Where do you see the error msg "No manifest detected"? If you can attach the screenshot of what you are getting and also the Chrome developer tool -> network and Application tabs screenshot, we could get whats going with it.

Answer 2

Confirmed: sometimes need to close the tab and reload the page to get manifest to re-initialize.

Possibly caused by caching the manifest file... and then not re-initialized in DevTools after cache update. Best guess, hard to tell.