MUI installation doesn't work with React 18-CodePudding

i was trying to install material ui core and icons with my react 18.0 project but i can't.The project has been created using the latest create-react-app npm install @material-ui/core @material-ui/icons

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 @material-ui/[email protected]
npm ERR! node_modules/@material-ui/core
npm ERR!   peer @material-ui/core@"^4.0.0" from @material-ui/[email protected]
npm ERR!   node_modules/@material-ui/icons
npm ERR!     @material-ui/icons@"*" 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 deleted npm-cache folder and re install it still doesn't work

CodePudding user response：

Install it with npm install @mui/material @emotion/react @emotion/styled --force

CodePudding user response：

I ran into a similar issue recently for a new project. We use an older version of React at work and @material-ui/core works fine. However, @material-ui/core has been deprecated and has been replaced with @mui/material. The syntax and import statements are a bit different from what you'll be used to with @material-ui/core, but the learning curve isn't too steep. The new version also gives you access to the sx prop for MUI components, which is really handy. It has also been documented to be about 10% more performant than older versions of MUI.

I'd suggest installing the newer version of Material UI and use it in your project.

Per mui.com the install script to get you started is:

npm install @mui/material @emotion/react @emotion/styled