CODEWITHSUNDEEP
github-pagescreate-react-applighthouse
BRose
BRose

Reputation: 111

How to fix manifest.json 404 with github pages

I am working on a Progressive Web App using Create-React-App and when I deploy to Github Pages I get a 404 for the android-chrome-192x192.png. It seems like the manifest is requesting it from 'myName.github.io/' instead of 'myName.github.io/myProject/'. When I add the project name in the file path, I get an error on my development server saying the image does not exist! All of the other icons are working fine, the issue seems only to be with the 192x192 png. I would appreciate some help if anyone has had the same issue, thank you much!

Here is the live version of the website with errors: https://brose55.github.io/robofriends/

This is for a PWA made with Create-React-App and deployed to Github Pages. I've tried to change file paths but nothing is working.

"icons": [
{
  "src": "favicon.ico",
  "sizes": "64x64 32x32 24x24 16x16",
  "type": "image/x-icon"
},
    {
        "src": "/android-chrome-192x192.png",
        "sizes": "192x192",
        "type": "image/png"
    },
    {
        "src": "/android-chrome-384x384.png",
        "sizes": "512x512",
        "type": "image/png"
    }
],

Expected request from ...github.io/robofriends but instead it is from ...github.io/

Upvotes: 6

Views: 8958

Answers (1)

BRose
BRose

Reputation: 111

This is a simple syntax error. Delete the '/' in front of the source url. Notice how 'favicon.icon' does not have a '/'.
ex: "src": "android-chrome-192x192.png",

Upvotes: 5

Related Questions