'Unable to install FluentUI packages for react app
I started learning React and FluentUI 2 hours back. I am trying out various tutorials available over internet but cannot just get through the FluentUI package installation step. I get the below error:
npm i @fluentui/react
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: [email protected]
npm ERR! Found: [email protected]
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.8.0 <17.0.0" from @fluentui/[email protected]
npm ERR! node_modules/@fluentui/react
npm ERR! @fluentui/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 ------\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! ------\Local\npm-cache\_logs\2020-12-10T12_41_32_759Z-debug.log
I tried uninstalling react and installing [email protected], but that doesn't help because there are other packages that depend on [email protected]. What can I do?
npm install [email protected]
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! Found: [email protected]
npm ERR! node_modules/react
npm ERR! react@"16.14.0" from the root project
npm ERR! peer react@"*" from @testing-library/[email protected]
npm ERR! node_modules/@testing-library/react
npm ERR! @testing-library/react@"^11.2.2" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react@"17.0.1" from [email protected]
npm ERR! node_modules/react-dom
npm ERR! peer react-dom@"*" from @testing-library/[email protected]
npm ERR! node_modules/@testing-library/react
npm ERR! @testing-library/react@"^11.2.2" from the root project
npm ERR! react-dom@"^17.0.1" 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!
Solution 1:[1]
I had same issue when trying to install fluentui package and after some trial/error loop I found that it works for me with react version 16.8 and I had to change following packages:
"@types/react": "16.8",
"@types/react-dom": "16.8",
"react": "16.8",
"react-dom": "16.8"
Hope this helps, cheers ;)
Solution 2:[2]
Microsoft Fluent-ui peer dependencies doesn't support React version 18. You got to wait for the package release or downgrade your application to version 16. Change your package.json.
"@types/react": "16.8",
"@types/react-dom": "16.8",
"react": "16.8",
"react-dom": "16.8"
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|---|
| Solution 1 | Dima Bondarenko |
| Solution 2 | Vipin T.K |