Manifest is not valid JSON. Line: 1, column: 1, Unexpected token

Question

keep getting this error: "Manifest is not valid JSON. Line: 1, column: 1, Unexpected token." i don't understand what the issue is with my code? here is what i have so far:

{
    "manifest_version": 2,
    "name": "extension",
    "version": "1.0",
    "description": "My first Chrome extension.",
    "browser_action": {
        "default_icon": "icon.jpg",
        "popup": "popup.html"
    }
}

Answer 1

I added crossorigin attribute its worked.

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

Answer 2

I had my manifest.json File Properties set with Build Action: None, in Visual Studio 2010.

Changing, in Visual Studio, to Content ensured the file was transferred when I deployed.

Maybe yours is a similar issue.

Edit

Given my downvote I thought I should expand and say that my point was that, given that at line 1, column 1 there is valid json, it is more likely that you are getting a 404 http response than the actual json file returned.

So maybe the file isn't in the correct place or the server doesn't have permissions or whatever but the above is what had gone wrong with mine. Admittedly it is maybe too specific to what had gone wrong with mine and not definitely what was wrong with yours.

But the general point still stands, it's more likely caused by web server returning an http response for the json file, check the response in the network log in your browser.

Answer 3

Content-type

Check the Content-Type of manifest.json in the Network tab. This needs to be application/json instead of text/html.

If you have wrong content-type, you may need to configure the settings of your webserver to correctly serve json files.

In my case I had to add it to the nginx sites-enabled file:

location ~* .(jpg|jpeg|gif|png|css|js|ico|xml|svg|json)$

Answer 4

It seems your are using wrong values for browser_action key.To specify popup template you must use default_popup. It should be :

{
  "manifest_version": 2,
  "name": "extension",
  "version": "1.0",
  "description": "My first Chrome extension.",
  "browser_action": {
      "default_icon": "icon.jpg",
      "default_popup": "popup.html"
  }
}

Answer 5

The browser cannot find the manifest because the extension (MIME type). In Chrome DevTools > Network > Headers > Content-Type, the content-type of the manifest must match the actual manifest file extension (.json or .webmanifest). To resolve the 404 error, you need to declare the file type in web.config:

<staticContent>
  <mimeMap fileExtension=".json" mimeType="application/json" />
  <mimeMap fileExtension=".webmanifest" mimeType="application/manifest+json" />
</staticContent>

Answer 6

I know this is an old question but just in case the accepted answer above doesn't work for someone be sure to check the spelling of and path to the manifest.json are correct. I previously got the same error from a simple typo. Simple mistake but it happens!

Answer 7

In my particular case, I had this added in my manifest.json:

"storage": {
   "managed_schema": "storage.json"
}

But my storage.json was empty. I had to edit my storage.json file with this content:

{
   "$schema": "http://json-schema.org/draft-03/schema#",
   "type": "object",
   "properties": {
      "adminSettings": {
         "title": "A valid JSON string compliant with backup format.",
         "description": "All entries present will overwrite local settings.",
         "type": "string"
      }
   }
}

But in general, here's my advice when you get this Line 1 Col 1 Unexpected Token misleading error that basically translates to: Something is wrong in one or more sections of your JSON and may or may not have anything to do with syntax in this file.

1. Move the most common, simple string things to the top of your manifest.json file such as manifest_version, name, description, etc.
2. Put the more elaborate array things towards the bottom, starting with the one you most suspect might be the problem.
3. Save the file as UTF-8.
4. Then, run it through an online validator.
5. From there, if you still get the problem, then use another notepad and cut/paste items from the bottom of your JSON into another text file and try to upload your JSON again. (Note, you'll likely get an error of ending your JSON block with a comma with no following item. So, don't forget to undo that when you get an error.)
6. Anyway, repeat step 4 until finally that Line 1 Col 1 error goes away. At that point, you know the offending section that you need to deal with.
7. Paste everything else back except that section back into your manifest.json. This is how I found out that my storage block was the problem. I looked at another Chrome Extension to see how they did things and realized my error.

Answer 8

This error also occurs when manifest is empty, or there is no manifest at all. If u use some framework, eg. Angular, just check whether you have manifest in your production build. If not - add "manifest.json" in your angular.json/angular-cli.json to assets array.

Example: "assets": ["assets", "favicon.ico", "manifest.json"]

Answer 9

This is old but I had the same issue and found out I was not using the standard double quotes " in my script which I copied and pasted from the official Google Doc

Answer 10

Please try to save the manifest.json file as UTF8 format.

Answer 11

This error is also present in production if you define wrong build folder to be the hosted files such as "public": "public" instead of "public": "build"

Answer 12

You're missing a comma after the second-to-last closed bracket. You should probably also change "browser_action" to "default_popup":

    "manifest_version": 2,
    "name": "extension",
    "version": "1.0",
    "description": "My first Chrome extension.",
    "browser_action": {
        "default_icon": "icon.jpg",
        "popup": "popup.html"
    },
}