[system] 5.15.3 peer dependency react@"^17.0.0" not found when using [email protected]

[jinsley8]

Steps to reproduce

Link to live example: https://github.com/jinsley8/mui-styles-issue

Steps:

1. Install repo
2. run npm install
3. npm install errors with a dependency conflict

Current behavior

npm install errors out with the following 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@"5.15.3" 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.

Expected behavior

@mui/[email protected] should be able to be installed properly along with [email protected].

https://github.com/mui/material-ui/blob/master/packages/mui-styles/package.json

@mui/styles has the following dependencies:

"devDependencies": {
    "@mui-internal/test-utils": "workspace:^",
    "@mui/material": "workspace:^",
    "@types/react": "^18.2.46",
    "@types/react-dom": "^18.2.18",
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
  },
  "peerDependencies": {
    "@types/react": "^17.0.0 || ^18.0.0",
    "react": "^17.0.0"
  },

Context

I'm trying to install @mui/[email protected] with [email protected]. How can I overcome this error with npm install?

It works with bun install and yarn install but I need to use npm

I have tried to install using Node v18, v20, v21 and all have to same issue.

Your environment

npx @mui/envinfo

  System:
    OS: macOS 14.2.1
  Binaries:
    Node: 18.18.2 - ~/.nvm/versions/node/v18.18.2/bin/node
    Yarn: 1.22.21 - /opt/homebrew/bin/yarn
    npm: 9.8.1 - ~/.nvm/versions/node/v18.18.2/bin/npm
  Browsers:
    Chrome: 120.0.6099.129
    Edge: 120.0.2210.121
    Safari: 17.2.1

Search keywords: dependencies,react,@mui/styles

[brijeshb42]

@mui/styles is not compatible with React 17. You'll have to either downgrade React or using @mui/system which is a emotion based package for runtime styling.