Material UI styles package is not compatible with React 18

Question

I am using react 18 with Material UI in my project. When i installed the styles package of the material UI then I got error that i mention below.

npm ERR! ERESOLVE could not resolve
npm ERR! 
npm ERR! While resolving: @mui/[email protected]
npm ERR! Found: [email protected]
npm ERR! node modules/react
npm ERR!   react@"18.2.0" from the root project
npm ERR!   peer react@">=16.8.0" from @emotion/[email protected]
npm ERR!   node_modules/@emotion/react
npm ERR!     @emotion/react@"11.11.1" from the root project
npm ERR!     peer @emotion/react@"^11.0.0-rc.0" from @emotion/[email protected]
npm ERR!     node_modules/@emotion/styled
npm ERR!       @emotion/styled@"11.11.0" from the root project
npm ERR!       3 more (@mui/material, @mui/styled-engine, @mui/system)
npm ERR!     3 more (@mui/material, @mui/styled engine, @mui/system)
npm ERR!   17 more (@emotion/styled, ...)
npm ERR! 
npm ERR! Could not resolve dependency:
npm ERR! peer react@"^17.0.0" from @mui/[email protected]
npm ERR! node_modules/@mui/styles
npm ERR!   @mui/styles@"^5.14.4" from the root project
npm ERR! 
npm ERR! Conflicting peer dependency: [email protected]
npm ERR! node_modules/react
npm ERR!   peer react@"^17.0.0" from @mui/[email protected]
npm ERR!   node_modules/@mui/styles
npm ERR!     @mui/styles@"^5.14.4" from the root project

I need this package for my project, can anyone suggest how I used it and any alternative method available?

• I tried to reduce the version of react but after that I got another error which is related to "test-library" package.

• I installed this package by using --force, but i need a permanent solution so in future i will not face any big issues.

Answer 1

The @mui/styles package has been deprecated since Material UI v5, released two years ago as I'm writing this. It will not be updated to support anything past React 17. If you need React 18 and beyond, you must use a different style solution. The doc I linked here explains all of this and strongly recommends moving to @mui/system, the current in-house style solution for Material UI.