I can't install " npm install semantic-ui-react semantic-ui-css", what should I do?
Asked Answered
M

2

5
C:\reactcamp\camp-project> npm install semantic-ui-react semantic-ui-css
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@"^18.0.0" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react@"^16.8.0 || ^17.0.0" from [email protected]
npm ERR! node_modules/semantic-ui-react
npm ERR!   semantic-ui-react@"^2.1.2" 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\zekis\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\zekis\AppData\Local\npm-cache\_logs\2022-05-01T18_07_14_536Z-debug-0.log
Magnesite answered 1/5, 2022 at 18:23 Comment(0)
D
6

TLDR: [email protected] is incompatible with React 18. As a workaround, you can downgrade your application to React 17.

While resolving: [email protected]

npm ERR! Found: [email protected]
npm ERR! node_modules/react
npm ERR!   react@"^18.0.0" from the root project

Those first three lines indicate that npm identified React 18 as your project's dependency.

Could not resolve dependency

npm ERR! peer react@"^16.8.0 || ^17.0.0" from [email protected]
npm ERR! node_modules/semantic-ui-react
npm ERR!   semantic-ui-react@"^2.1.2" from the root project

These 3 lines list semantic-ui-react's peer dependency, meaning it expects your project to have either React 16.8 or React 17 as dependency.

Fix the upstream dependency conflict

There are two ways to address this conflict:

  1. Downgrade your project to React 17 using npm install react@17
  2. Override semantic-ui-react's using yarn's Selective Resolution feature. Inside your package.json:
"resolutions": {
    "semantic-ui-react/react": "^18.0.0"
}
Danais answered 1/5, 2022 at 18:58 Comment(1)
Should be resolved in [email protected]Keaton
W
0

You can use this article it helped me solved the same problem when i wanted to install semantic-ui with react 18 it will probably help you with other frameworks that doesn't compatible with react 18

Wexford answered 1/6, 2022 at 7:36 Comment(0)

© 2022 - 2024 — McMap. All rights reserved.