Get error while installing react-notifications-component package with React 18 - reactjs

I used react-notifications-component (npm) before and it was working fine. but recently I tried to install it with react 18 and I got this error:
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: code-challenge-front#0.1.0
npm ERR! Found: react#18.0.0
npm ERR! node_modules/react
npm ERR! react#"^18.0.0" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react#"^17.0.1" from react-notifications-component#3.4.1
npm ERR! node_modules/react-notifications-component
npm ERR! react-notifications-component#"*" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR!
npm ERR! A complete log of this run can be found in:
is there any solution? or I have to use another package?

react-notifications-component#3.4.1 is using peer dependencies of react#"^17.0.1"
If you want to use react-notifications-component#3.4.1 then you have to use react#"^17.0.1" otherwise you can not use it with react#"^18.0.0" till react-notifications-component provides new version support with react 18.
Alternatively, you can use npm i --legacy-peer-deps to avoid this issue.

This is a bug that and there is no solution for it right now... maybe in future...
https://github.com/teodosii/react-notifications-component/issues/152
you can use another package(recommended)
don't downgrade your react version(not a good solution)

Related

How to solve the dependency error of tawk to chat npm package with react 18.1.0?

I am trying to install tawk to chat npm package from https://github.com/tawk/tawk-messenger-react. But I get the following error as attached below. I fear if I choose to install it forcefully, it will mess up my code-base. How can I solve it?
error log URL- https://termbin.com/4q35
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: laptop-warehouse#0.1.0
npm ERR! Found: react-dom#18.1.0
npm ERR! node_modules/react-dom
npm ERR! react-dom#"^18.1.0" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react-dom#"^17.0.2" from #tawk.to/tawk-messenger-react#1.0.0
npm ERR! node_modules/#tawk.to/tawk-messenger-react
npm ERR! #tawk.to/tawk-messenger-react#"*" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR!
npm ERR! See /home/somaya/.npm/eresolve-report.txt for a full report.
npm ERR! A complete log of this run can be found in:
npm ERR! /home/somaya/.npm/_logs/2022-05-07T19_08_49_501Z-debug-0.log
Looks like #tawk.to/tawk-messenger-react# package isn't compatible with react-dom 18. Try using react-dom#"^17.0.2"
try running npm install <dependencyName> --force or npm install <dependencyName> --legacy-peer-deps
if that doesnt work remove node modules and install packages again
if that also doesnt work then you will have to downgrade your react and react-dom versions
If you're using react 18.1.0 you should use #tawk.to/tawk-messenger-react#2.0.1
Base on the error you provide you are using #tawk.to/tawk-messenger-react#1.0.0 which supports react 17 and conflict on version you are using.
Our messenger version 1.*.* is supporting react 17
and version 2.*.* for supporting react 18

Issues setting up react using Create React App

I am a newbie trying to set up React for the first time. I have an error when I am trying to install it on my computer. I have created a folder in my Documents folder for all the projects I was planning on making, if that makes a difference too. I am not running this in root. Below are the errors I keep getting and I am not sure what they mean. I have googled and found a few forum posts, but none of their solutions work. I am hoping it is something small I have missed.
Installing template dependencies using npm...
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR!
While resolving: my-app#0.1.0
npm ERR! Found: react#18.0.0
npm ERR!
node_modules/react
npm ERR! react#"^18.0.0" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer
react#"<18.0.0" from #testing-library/react#12.1.5
npm ERR!
node_modules/#testing-library/react
npm ERR!
#testing-library/react#"^12.0.0" from the root project
npm ERR!
npm
ERR! Fix the upstream dependency conflict, or retry
npm ERR! this
command with --force, or --legacy-peer-deps
npm ERR! to accept an
incorrect (and potentially broken) dependency resolution.
npm ERR!
npm
ERR! See C:\Users\Luke\AppData\Local\npm-cache\eresolve-report.txt for
a full report.
npm ERR! A complete log of this run can be found in: npm ERR!
C:\Users\Luke\AppData\Local\npm-cache_logs\2022-04-12T04_55_21_058Z-debug-0.log
npm install --no-audit --save #testing-library/jest-dom#^5.14.1 #testing-library/react#^12.0.0 #testing-library/user-event#^13.2.1 web-vitals#^2.1.0 failed PS C:\Users\Luke\Documents\React-Projects>

ERESOLVE unable to resolve dependency tree in react

Trying add dependencies react but i cannot install any packages. I recently deleted a package-lock.json to resolve ELOCKVERIFY error. I eventually installed the following command of 'npm audit fix' but I still carry the same ERESOLVE error.
npm audit fix
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: client#0.1.0
npm ERR! Found: react#17.0.2
npm ERR! node_modules/react
npm ERR! react#"^17.0.1" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react#"^16.0.0" from react-simple-typewriter#1.0.13
npm ERR! node_modules/react-simple-typewriter
npm ERR! react-simple-typewriter#"^1.0.13" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR!
npm ERR! See C:\Users\Owner\AppData\Local\npm-cache\eresolve-report.txt for a full report.
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\Owner\AppData\Local\npm-cache\_logs\2021-05-11T19_07_29_767Z-debug.log
react-simple-typewriter version 1.0.13 requires version 16.x, while you have version 17.0.2.
Either upgrade react-simple-typewriter to a version that supports React 17.x (if there is one) or downgrade React to 16.x

After installing chai, i was installing chai-webdriverio as a dev dependency but i got this error

npm i chai-webdriverio --save-dev
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: webdriverio#1.0.0
npm ERR! Found: chai#4.3.4
npm ERR! node_modules/chai
npm ERR! dev chai#"^4.3.4" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer chai#"~4.0.1" from chai-webdriverio#1.0.0
npm ERR! node_modules/chai-webdriverio
npm ERR! dev chai-webdriverio#"*" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
I was able to solve this issue by running
npm install chai-webdriverio --force
Note: Using --force makes the recommended protections to be disabled.
Another option is to install the required version of chai instead :
npm install chai#4.0.1 --save-dev
Maybe this is more consistent

while trying to install react-bootstrap-table i am getting an error like this

PS C:\Users\ravur\demo-web-page> npm install react-bootstrap-table
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: demo-web-page#0.1.0
npm ERR! Found: react#17.0.2
npm ERR! node_modules/react
npm ERR! react#"^17.0.2" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react#"^15.0.0 || ^16.0.0" from react-bootstrap-table#4.3.1
npm ERR! node_modules/react-bootstrap-table
npm ERR! react-bootstrap-table#"*" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR!
npm ERR! See C:\Users\ravur\AppData\Local\npm-cache\eresolve-report.txt for a full report.
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\ravur\AppData\Local\npm-cache_logs\2021-04-27T07_14_51_100Z-debug.log
That is caused by the React version you are using react#"^17.0.2", while the react-bootstrap-table library is based upon react#"^15.0.0 || ^16.0.0".
Since the difference in version is a major release, you could incur in problems hard to debug, since react could have implemented changes that could have broken the library functionality e.a. reason why npm throws you that error.
At this point, you could either set your project to use react 16 instead of 17 to make sure nothing breaks or you could otherwise keep your version as is and force the library installation as such: npm i react-bootstrap-table --legacy-peer-deps.
If you opt for the second alternative, you know you won't need to use --legacy-peer-deps for new installations as soon as the library maintainers will update the library to work off v.17.

Resources