Unexpected string in JSON at position 608 while parsing

user_7538023 0
Viewed 20553

I'm trying to host my react website to GitHub, but when I try to use:

npm install --save gh-pages

I get the following error:

Failed to parse json
npm ERR! JSON.parse Unexpected string in JSON at position 608 while parsing '{
npm ERR! JSON.parse   "name": "myportfoliosite",
npm ERR! JSON.parse   "versio'

The repository is at: https://github.com/InquisitiveDev2016/React-Developer-Portfolio2

Here is the package.json file:

{
  "name": "myportfoliosite",
  "version": "0.1.0",
  "private": true,
  "homepage": "https://github.com/InquisitiveDev2016/React-Developer-Portfolio2",
  "dependencies": {
    "react": "^16.8.6",
    "react-dom": "^16.8.6",
    "react-mdl": "^1.11.0",
    "react-router-dom": "^5.0.1",
    "react-scripts": "3.0.1"
  },
  "scripts": {
    "predeploy": "npm run build",
    "deploy": "gh-pages -d build",
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": "react-app"
  }
}
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  }
}

I am trying to follow the instructions under the GitHub pages folder at: https://facebook.github.io/create-react-app/docs/deployment

But I am stuck, can someone please check what's wrong with the file?

npm github-pages reactjs json javascript
6 Answers

This package.json was not a valid JSON you can try to fix the JSON structure, using online tools like and validate the JSON

https://jsoneditoronline.org/

https://jsonformatter.org/

below JSON should work for you:

    {
      "name": "myportfoliosite",
      "version": "0.1.0",
      "private": true,
      "homepage": "https://github.com/InquisitiveDev2016/React-Developer-Portfolio2",
      "dependencies": {
        "react": "^16.8.6",
        "react-dom": "^16.8.6",
        "react-mdl": "^1.11.0",
        "react-router-dom": "^5.0.1",
        "react-scripts": "3.0.1"
      },
      "scripts": {
        "predeploy": "npm run build",
        "deploy": "gh-pages -d build",
        "start": "react-scripts start",
        "build": "react-scripts build",
        "test": "react-scripts test",
        "eject": "react-scripts eject"
      },
      "eslintConfig": {
        "extends": "react-app"
      },
      "browserslist": {
        "production": [
          ">0.2%",
          "not dead",
          "not op_mini all"
        ],
        "development": [
          "last 1 chrome version",
          "last 1 firefox version",
          "last 1 safari version"
        ]
}
}
user_116815510

I faced similar issue and my json was valid and structured. This issue was due to invalid package-lock.json file. Delete your package-lock.json file and run npm install. It will re-generate your package-lock.json file and works fine.

user_112191710

Another reason can be your package-lock.json file. Sometimes it gets corrupted, so you have to delete that file and run the npm install again.

user_10494420

Your package.json file is malformed, I ran into the same issues locally. I fixed them like so, please note the <- comments indicating what I changed.

{
  "name": "myportfoliosite",
  "version": "0.1.0",
  "private": true,
  "homepage": "https://github.com/InquisitiveDev2016/React-Developer-Portfolio2",
  "dependencies": {
    "react": "^16.8.6",
    "react-dom": "^16.8.6",
    "react-mdl": "^1.11.0",
    "react-router-dom": "^5.0.1",
    "react-scripts": "3.0.1"
  },
  "scripts": {
    "predeploy": "npm run build",
    "deploy": "gh-pages -d build",
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject" <- Removed an extra comma here
  },
  "eslintConfig": {
    "extends": "react-app"
  } <- Removed an extra comma here
} <- You missed a final closing curly bracket here

With the changes I had no problem installing gh-pages. Hope that helps!

user_29427650

Sometimes, it could be an error in the declaration of the json object, check double quotes, commas, brackets etc.

user_133835110

Interesting that it happens related to "gh-pages" for me as well....that is a common denominator for ending up here. I have one clue.. I edited by hand adding the 'homepage' field instructed by the gh-pages tutorial and it did not show a comma at the end of the line. And my mind was enough asleep to not realize one was needed. Goes for the other of those lines as well. Remember also last line of a section shall not end with a comma. So if you insert your line as the last line of a section (thus not with a comma) remember the previous last line now needs a comma.

See https://terieyenike.medium.com/how-to-deploy-react-apps-to-github-16830823a9fa Step 3..

The error message telling what character position in the file lead me to it.

user_3457590
Related