Manifest: Line: 1, column: 1, Syntax error on Chrome browser Manifest: Line: 1, column: 1, Syntax error on Chrome browser google-chrome google-chrome

Manifest: Line: 1, column: 1, Syntax error on Chrome browser


I had the same problem when I moved my Codesandbox project to local. In my case, there was no manifest.json file in the public folder.I solved it by adding the default manifest.json that create-react-app generates:

{  "short_name": "CloseWeUI",  "name": "The front-end UI for CloseWe",  "icons": [    {      "src": "favicon.ico",      "sizes": "64x64 32x32 24x24 16x16",      "type": "image/x-icon"    }  ],  "start_url": ".",  "display": "standalone",  "theme_color": "#000000",  "background_color": "#ffffff"}


I had the same problem ("Manifest: Line: 1, column: 1, Syntax error") while running my app (react app with react-router, published with AWS Amplify).

My problem was fixed by doing the following:In "Rewrites and redirects" make sure you have "json" in the following line:

Source address:</^[^.]+$|\.(?!(css|gif|ico|json|jpg|js|png|txt|svg|woff|ttf)$)([^.]+$)/>Target address:/index.htmlType:200 (Rewrite)

The above solution also fixed problem with non-working react-router links in production as it was reported in the following thread:React Router DOM not working correctly on Amplify Console AWS

Here is to my personal project with fixed manifest.json issue, as well as non-working react-router issue (a link to some random code snippet - fibonacci memoization in this case):

https://everhint.com/hintlink/algorithms/javascript/codesnippet/fibonacci/memoization/fibonacci-memoization/d01f275b-6acf-4f26-9448-e99939c9d4b7.html


As I added password protection to a developer-only page of mine, I suddenly started getting "manifest line 1 column 1 syntax error" (manifest.json) errors.

I am also using AWS Amplify as well as Create React App to build my app. I tried all of the solutions above, but nothing helped.

The one thing that did help was adding one property to the link to my manifest.json in my index.html.

To solve this, I added crossorigin="use-credentials"*, like below:

<link crossorigin="use-credentials" rel="manifest" href="./manifest.json" />