Dependency resolution issue while trying to install the @mui/styles package.

[01-Psyche]

Duplicates

• I have searched the existing issues

Related page

https://mui.com/system/styles/basics/

Kind of issue

Other

Issue description

I was looking for trying to install the @mui/styles package using npm install @mui/styles and it appears that i am getting a compatibility error

the error

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.2.0" from the root project
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@"*" 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\user\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\user\AppData\Local\npm-cache\_logs\2023-09-15T12_19_48_487Z-debug-0.log
PS C:\Users\user\mui-master> npm install @mui/styles
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.2.0" from the root project
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@"*" 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\user\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\user\AppData\Local\npm-cache\_logs\2023-09-15T12_23_46_216Z-debug-0.log

Dependencies:

"dependencies": {
    "@emotion/react": "^11.11.1",
    "@emotion/styled": "^11.11.0",
    "@fontsource/inter": "^5.0.8",
    "@mui/icons-material": "^5.14.9",
    "@mui/joy": "^5.0.0-beta.5",
    "@mui/material": "^5.14.8",
    "@testing-library/jest-dom": "^5.17.0",
    "@testing-library/react": "^13.4.0",
    "@testing-library/user-event": "^13.5.0",
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
    "react-router-dom": "^6.15.0",
    "react-scripts": "5.0.1",
    "web-vitals": "^2.1.4"
  }

Context 🔦

I am try to install @mui/styles

[01-Psyche]

I noticed a warning in the @mui/styles(LEGACY) Page https://mui.com/system/styles/basics/ which says **@mui/styles is not compatible with [React.StrictMode](https://react.dev/reference/react/StrictMode) or React 18.** but in the Youtube tutorial i am watching https://youtu.be/vCMUp_dV0ss?si=FBF7E9V1RJyWIo2q at 25:33 the person (@constgenius) is able to install the same version using the npm install @mui/styles but i keep getting an error

[mj12albert]

Duplicate of #38209

[mj12albert]

@01-Psyche I believe with npm you can ignore peer dependency requirements: https://stackoverflow.com/a/66035709

Still, the legacy styles package is not compatible with React 18

[01-Psyche]

Thanks, ignoring using legacy peers fixed it