npm · npm
The message
npm ERR! Conflicting peer dependency: react@18.3.1
What it means
This line picks out the actual clashing pair inside the ERESOLVE report: this package demands that version of a peer while your tree holds a different one. It usually means the host library had a major bump and a plugin that uses it has not caught up. Asking by name with npm ls react prints, as a tree, who required which version, and which of the two you have to move becomes obvious on the spot. Upgrading the plugin is the real fix; --force writes the mismatched tree anyway and hides the problem until runtime.
The fix
npm ls react- Printed by
- npm
- npm
- 20
With npm the cause sits in the first code XXXX line rather than the last six npm ERR! lines, and when the failure comes from the dependency tree or a native build instead of your own code, deleting node_modules and installing again clears about half of them.
Reading an error message
- Read from the first line down. The lower you go the more it is about the tool’s internals; the cause is usually at the top.
- If there is a file and a line number, start there — not the top stack frame, but the topmost line that names a file you wrote.
- Search the message verbatim, but strip your own paths and variable names first; those are what stop the search from matching.
- The same condition is worded differently across tool versions. If results look wrong, add the version number to the query.
- Before pasting a fix, check what it throws away. Some of these cannot be undone.
Common questions
Q. What does “npm ERR! Conflicting peer dependency: react@18.3.1” mean?
This line picks out the actual clashing pair inside the ERESOLVE report: this package demands that version of a peer while your tree holds a different one. It usually means the host library had a major bump and a plugin that uses it has not caught up. Asking by name with npm ls react prints, as a tree, who required which version, and which of the two you have to move becomes obvious on the spot. Upgrading the plugin is the real fix; --force writes the mismatched tree anyway and hides the problem until runtime.
Q. How do I fix it?
npm ls react — before running it, check the explanation above for what this command discards.
Q. Which tool prints this?
npm. It sits under npm, and the message runs to 6 words.