CODEWITHSUNDEEP
javascriptnode.jsprogressive-web-apps
blissful8
blissful8

Reputation: 3

What is the reason for this error in my manifest file

I am trying to build a progressive Web App in Nodejs environment. I get a 404 and syntax error in console panel. I am unable to identify exactly whats wrong with my manifest code. 

service worker registered     (pwa.js:3)

Failed to load resource: the server responded with a status of 404 (Not Found)     (manifest.json:1) 

Manifest: Line: 1, column: 1, Syntax error.     (manifest.json:1)

caching shell assets     (sw.js:14)

My root directory structure:

/node_modules/
/public/
        css/
        images/
        home.html
        index.html
        pwa.js
        sw.js

/app.js
manifest.json
package.json

This is my manifest.json file

{
  "name": "PlayPack",
  "short_name": "PlayPack",
  "start_url": "/public/index.html",
  "display": "standalone",
  "background_color": "#FFE9D2",
  "theme_color": "#FFE1C4",
  "orientation": "portrait-primary",
  "icons": [
    {
      "src": "/public/images/icons/icon-72x72.png",
      "type": "image/png",
      "sizes": "72x72"
    },
    {
      "src": "/public/images/icons/icon-96x96.png",
      "type": "image/png",
      "sizes": "96x96"
    },
    {
      "src": "/public/images/icons/icon-128x128.png",
      "type": "image/png",
      "sizes": "128x128"
    },
    {
      "src": "/public/images/icons/icon-144x144.png",
      "type": "image/png",
      "sizes": "144x144"
    },
    {
      "src": "/public/images/icons/icon-152x152.png",
      "type": "image/png",
      "sizes": "152x152"
    },
    {
      "src": "/public/images/icons/icon-192x192.png",
      "type": "image/png",
      "sizes": "192x192"
    },
    {
      "src": "/public/images/icons/icon-384x384.png",
      "type": "image/png",
      "sizes": "384x384"
    },
    {
      "src": "/public/images/icons/icon-512x512.png",
      "type": "image/png",
      "sizes": "512x512"
    }
  ]
}

app.js

const express = require("express");    
const bodyParser = require('body-parser');    
const app = express();    
const http = require('http').Server(app);
const port = process.env.PORT || 3000;

app.use(express.static(__dirname + "/public"));
app.use(bodyParser.json()); 
app.use(bodyParser.urlencoded({ extended: true }));        
app.get("/", (req, res) => {
   res.sendFile(__dirname + "/public/index.html");

});
app.get("/home", (req, res) => {
  res.sendFile(__dirname + "/public/home.html");

 });

pwa.js file checks if('serviceWorker' in navigator){ } and registers the service worker . It does nothing else.

I would like to know if its really necessary to specify an index.html file in my Manifest file?

Obviously I have not worked in PWA's before. Please guide me

Upvotes: 0

Views: 2662

Answers (1)

wirher
wirher

Reputation: 976

Move your manifest.json file to /public folder since this is where the static files are served from.

Upvotes: 2

Related Questions