I ran npm install prop-types --save-dev and started getting this error

'prop-types' should be listed in the project's dependencies, not devDependencies import/no-extraneous-dependencies

Later I uninstalled the dependency by running npm uninstall prop-types --save-dev and installed again by running npm install prop-types --save

Still the error doesn't go

'prop-types' should be listed in the project's dependencies. Run 'npm i -S prop-types' to add it import/no-extraneous-dependencies

I ran npm install prop-types --save-dev and started getting this error

'prop-types' should be listed in the project's dependencies, not devDependencies import/no-extraneous-dependencies

Later I uninstalled the dependency by running npm uninstall prop-types --save-dev and installed again by running npm install prop-types --save

Still the error doesn't go

'prop-types' should be listed in the project's dependencies. Run 'npm i -S prop-types' to add it import/no-extraneous-dependencies

• javascript
• reactjs
• react-proptypes

• Go to your package.json, and move prop-types from devDependencies to dependencies – Nicholas Tower Commented Jan 24, 2021 at 0:42
• Save to the regular dependencies, not the dev ones. – Drew Reese Commented Jan 24, 2021 at 0:42
• still doesn't work after relaunching the console – Rahul Yadav Commented Jan 24, 2021 at 0:48
• —save-dev saves to dev dependencies, just use —save or avoid that flag entirely as —save is default behavior – Alexander Staroselsky Commented Jan 24, 2021 at 1:08
• Better answer is to just edit the lint rule. prop-types is a dev dependency, not a real dependency. See: stackoverflow.com/questions/43989739/… – Adam Jenkins Commented Jun 3, 2022 at 12:32

3 Answers 3

Your package.json probably currently looks something like

{
  "name": "your-website",
  ...
  "dependencies": {
    "react": "^16.10.2",
    "react-dom": "^16.10.2",
    "webpack": "^4.44.1",
    ...

  },
  "devDependencies": {
    "prop-types": "^15.7.2",
    "@types/node": "^14.0.18",
    ...
  },
}

Make it look like

{
  "name": "your-website",
  ...
  "dependencies": {
    "react": "^16.10.2",
    "react-dom": "^16.10.2",
    "webpack": "^4.44.1",
    "prop-types": "^15.7.2",
    ...

  },
  "devDependencies": {
    "@types/node": "^14.0.18",
    ...
  },
}

by moving prop-types from devDependencies to dependencies

After this, run npm install or yarn install if you are using yarn

• you may need to delete your node_modules folder before running npm install

Your devDependencies are the ones that are used while building your project. They are not present in the production of your project. When someone opens a website in a browser the code for the devDependencies is not in it

When you install a package

• using npm install will put the package into your package.json as a dependency
• using npm install --save-dev will put the package in your package.json as a devDependency

You should execute this command: rm -rfd ./node_modules to delete node_modules directory and then change your package.json manually like this:

  "dependencies": {
    ...
    "prop-types": <YOUR_VERSION>,
  },
  "devDependencies": {
    ...
  },

and finally, run npm i or yarn if you're using yarn.

I had the same issue and this is what helped me; I think I had hit an npm bug and so I ran "npm install prop-types", then removed the node_modules and package-lock.json; and ran npm install afresh. Worked well after that!