learner
learner

Reputation: 1321

UNMET PEER DEPENDENCY with react

I'm having javascript problems related to react. This is the error caught by chrome when page is rendering:

Uncaught TypeError: Super expression must either be null or a function, not undefined
at _inherits (application.js:16301)
at application.js:16310
at Object.232.prop-types (application.js:16549)
at s (application.js:1)
at application.js:1
at Object.233../Collapse (application.js:16574)
at s (application.js:1)
at application.js:1
at Object.1.react (application.js:78)
at s (application.js:1)

When I've install my react using npm it complains about peer dependencies of react and react-height:

├─┬ UNMET PEER DEPENDENCY [email protected]
│ ├─┬ [email protected] 
│ │ └─┬ [email protected] 
│ │   ├── [email protected] 
│ │   ├─┬ [email protected] 
│ │   │ ├─┬ [email protected] 
...

And:

├─┬ UNMET PEER DEPENDENCY [email protected]
│ └─┬ [email protected] 
│   └─┬ [email protected] 
│     └── [email protected] 

After that I changed my package.json file to:

"react": "0.14.9",
"react-bootstrap": "^0.28.1",
"react-collapse": "^2.2.1",
"react-dom": "^0.14.3",
"react-height": "2.2.1",
...

After these changes I removed completely node_modules folder with rm -rf did an npm cache clean and reinstall again.

The VERY SAME problem continues to occur. I notice 2 warnings:

npm WARN [email protected] requires a peer of react@>=15.3 but none was installed.
npm WARN [email protected] requires a peer of react-height@^3 but none was installed.

Is there a problem to update the packages or a problem related to react itself?

Upvotes: 9

Views: 31283

Answers (2)

Bikash Adhikari
Bikash Adhikari

Reputation: 15

Make sure you have a package.lock.json file in your directory. React uses yarn command, instead of trying npm install try doing yarn add <package name>

I had the same peer dependency error during netlify build and deploy with my react-elastic-carousel and the only thing that solved it was.

yarn add react-elastic-carousel

Hope it helps!

Upvotes: 0

loelsonk
loelsonk

Reputation: 3598

Your react version doesn't meet react-collapse requirements. It doesn't really mean that both packages can't work together, just try it and if everything works as intended.

But if you need to fix that you have two ways of doing that:

First way

Delete "react": "0.14.9", line, and run npm i --save react. NPM will install latest react package. Error should be fixed.


Second way

If you really need to use 0.14.9 version you should find react-collapse version which is compatible with your reactjs version.

To do so type in your console npm show react-collapse versions - an array of records will show up.

Now we have to pick one earlier version and check the peerDependencies of our selected package.

We use npm view [email protected] command, the result will be

enter image description here

Because we selected @3.0.0 version which is ok in our case, we need to install it. Following command will do the work npm install --save [email protected].

UPDATE

If above solution does not work. Please install missing peerDependencies manually via npm i --save <package-name>.

Explaination:

Check your npm version doing npm -v. If your version is > 3 then it means peer dependencies must be installed manually. I guess that is the case, version 3.0.0 was released in mid 2015.

The automatic install of peer dependencies was explicitly removed with npm 3, as it cause more problems than it tried to solve.

Please read official npm changelog, you are looking for section "breaking changes".

There is CLI tool which installs an NPM package and its peer dependencies automatically. You might be interested in.

Upvotes: 6

Related Questions