未满足的对等依赖与反应

Question

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 react@0.14.9
│ ├─┬ envify@3.4.1 
│ │ └─┬ jstransform@11.0.3 
│ │   ├── base62@1.1.2 
│ │   ├─┬ commoner@0.10.8 
│ │   │ ├─┬ commander@2.9.0 
...

And:

├─┬ UNMET PEER DEPENDENCY react-height@2.2.1
│ └─┬ create-react-class@15.5.2 
│   └─┬ fbjs@0.8.12 
│     └── core-js@1.2.7 

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 react-collapse@2.4.0 requires a peer of react@>=15.3 but none was installed.
npm WARN react-collapse@2.4.0 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?

Answer 1

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 react-collapse@3.0.0 command, the result will be

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 react-collapse@3.0.0 .

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.

Answer 2

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!