React npm start not working : 'No version of chokidar available'

user_14900449 0
Viewed 30137

I cloned my already working React-Typescript app on Github Pages, from Github and wanted to make some changes. I ran npm install and installed all the dependencies but when I run npm start, I got this error;

enter image description here

I don't know what chokidar is and I looked a little bit and I think it's unrelated to my project. Still I tried to npm install chokidar and I got another error like this;

enter image description here

Also tried npm audit fix as well. Fixed some stuff but nothing changed.

So I can't open the development server. Additionally, this is the package.json file;

// package.json
{
  "name": "panflix",
  "homepage": "https://absolutezero13.github.io/meerkast/",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@testing-library/jest-dom": "^5.11.4",
    "@testing-library/react": "^11.1.0",
    "@testing-library/user-event": "^12.1.10",
    "@types/enzyme": "^3.10.8",
    "@types/jest": "^26.0.15",
    "@types/node": "^12.0.0",
    "@types/react": "^17.0.0",
    "@types/react-dom": "^17.0.0",
    "@types/redux-devtools": "^3.0.47",
    "axios": "^0.21.1",
    "enzyme": "^3.11.0",
    "firebase": "^8.2.7",
    "gh-pages": "^3.1.0",
    "history": "^4.10.1",
    "react": "^17.0.1",
    "react-bootstrap": "^1.5.0",
    "react-dom": "^17.0.1",
    "react-redux": "^7.2.2",
    "react-router-dom": "^5.2.0",
    "react-scripts": "4.0.2",
    "redux": "^4.0.5",
    "redux-devtools-extension": "^2.13.8",
    "redux-thunk": "^2.3.0",
    "typescript": "^4.1.2",
    "web-vitals": "^1.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",
      "react-app/jest"
    ]
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  },
  "devDependencies": {
    "@types/react-redux": "^7.1.16",
    "@types/react-router-dom": "^5.1.7"
  }
}

I tried npm install -g chokidar and it is installed. But I'm getting the same error as before "no version chokidar is available."

Other react projects are working fine.

chokidar npm typescript reactjs
8 Answers

I had the same issue. What worked for me is forcing updates on local npm packages:

npm update --force

Before

$ npm list chokidar
pwa-react-showcase@0.1.0
└─┬ react-scripts@4.0.3
  └─┬ webpack-dev-server@3.11.1
    └── chokidar@2.1.8

After

$ npm list chokidar
pwa-react-showcase@0.1.0
└─┬ react-scripts@4.0.3
  ├─┬ webpack-dev-server@3.11.1
  │ └── chokidar@2.1.8
  └─┬ webpack@4.44.2
    └─┬ watchpack@1.7.5
      ├── chokidar@3.5.1
      └─┬ watchpack-chokidar2@2.0.1
        └── chokidar@2.1.8

Update

We found that NPM 7 was the issue. Downgrading to NPM 6.14.12 works without any changes.

user_16433960

Just solved my issue by running

npm update chokidar

This will update the package-lock.json with latest chokidar info. Now running react without any issues with npm 7.15 and node 14.16. There is no need to force install or do anything quirky. Just update chokidar to keep your package files consistent and keep development running for everyone in the team.

Original problem came up when I updated from NPM 6 to version 7. There is also a bug ticket in github: https://github.com/facebook/create-react-app/issues/10811

user_21308140

The same problem occurred to me after upgrading from npm@6.x to npm@7.x. I solved my problem with simply installing chokidar as a DevDependency. Everything works as expected (development, production build and tests)

For more assurance run:

npm i -g npm
npm cache verify
npm i -D chokidar
npm i
user_29082770

Chockidar is a dependency inside watchpak which takes care of hot reloads on save on development environment.

Chuckidar 2 has problems with node v14+.

For me, npm update did update watchpack to use chockidar 3.

user_134181700

You needs to update chokidar. So simply needs to hit the command npm update chokidar OR npm update chokidar@2

if you gets error like as invalid json response body at https://registry.npmjs.org/chokidar reason: Unexpected end of JSON input

Then main reason for it may be cache, so you have to clean cache. For that, hit the command npm cache clean --force

After this, if you again gets one more error like as

 `ENOENT: no such file or directory, scandir '/node_modules/node-sass/vendor'`

Then you needs to rebuild node sass, by hitting the command npm rebuild node-sass

That's all, how it worked for me.

user_108051270

It is because the version of chokidar NEEDS to be updated to 3

Method 1:

npm i chokidar@latest --force

This worked for me. npm itself says : npm WARN deprecated chokidar@2.1.8: Chokidar 2 will break on node v14+. Upgrade to chokidar 3 with 15x less dependencies.

Method 2(Recommended):

npm audit fix

If you are connecting via proxy on company network this might not work for you and you could get something like this:

npm ERR! audit endpoint returned an error

Method 3:

  • Downgrade npm version to 6

Method 4:

npm update --force

Would not recommended for large projects.

user_165561380

Updating Chokidar dependency solved the problem for me.

npm update chokidar

user_107799580

I got this problem today I search everywhere, and then fix my problem with this:

$ npm update --force

user_157599540
Related