1

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: fluent-ui-todo-app@0.1.0
npm ERR! Found: react@17.0.1
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/react@7.153.4
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 react@16.14.0, but that doesn't help because there are other packages that depend on react@17.0.1. What can I do?

npm install react@16.14.0
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! Found: react@16.14.0
npm ERR! node_modules/react
npm ERR!   react@"16.14.0" from the root project
npm ERR!   peer react@"*" from @testing-library/react@11.2.2
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 react-dom@17.0.1
npm ERR! node_modules/react-dom
npm ERR!   peer react-dom@"*" from @testing-library/react@11.2.2
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!
Purbasha
  • 215
  • 2
  • 11

2 Answers2

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 ;)

Dima Bondarenko
  • 51
  • 5
1

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"
Vipin T.K
  • 11
  • 1