programing

MUI 설치는 React 18에서 작동하지 않습니다.

newstyles 2023. 3. 20. 21:44

MUI 설치는 React 18에서 작동하지 않습니다.

리액트 18.0 프로젝트에서 material ui core와 아이콘을 설치하려고 했지만 설치할 수 없습니다.최신 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: client@0.1.0
npm ERR! Found: react@18.0.0
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/core@4.12.3
npm ERR! node_modules/@material-ui/core
npm ERR!   peer @material-ui/core@"^4.0.0" from @material-ui/icons@4.11.2
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.

npm-cache 폴더를 삭제하고 다시 설치해도 작동하지 않습니다.

npm install @mui/material @emotion/react @emotion/styled --legacy-peer-deps
npm install @mui/icons-material --legacy-peer-deps

Github 문제 : https://github.com/mui/material-ui/issues/32074

npm i @material-ui/core --legacy-peer-deps

2022.04.24 실제:

  • material-ui/코어 v4.12.4
  • 리액션 v18.0.0

와 함께 설치 방법npm install @mui/material @emotion/react @emotion/styled --force

reactjs에 Materal UI v5를 사용할 수 있습니다.

https://mui.com/material-ui/getting-started/installation/

또는

MUI를 Reactjs와 함께 작동시키는 또 다른 방법은 반응 버전을 17로 분해하는 것입니다.

react version과 react-dom version을 17로 열화하면 동작합니다.

짐을 맡깁니다.json 파일에는 react 및 react-dom 버전이 18로 표시됩니다.mui v4가 Reactjs와 함께 작동하려면 버전을 열화해야 합니다.

버전 17로 성능 저하 시 --force 플래그 사용

또는 반응을 18에서 17로 저하시키지 않으려면 아래 지침을 따르십시오.

react > = 17.0.0 및 react-dom > = 17.0.0의 경우 MUI v5를 사용한다.

react 버전이 17보다 큰 경우 Material UI(버전) v5를 설치해야 합니다.

주의: MUI v5가 react@17.0.x에서 동작하지 않으면 MUI(버전) v4를 설치합니다.

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

그리고.

react > = 16.8.0 및 react-dom > = 16.8.0의 경우 다음과 같이 한다.

// with npm
npm install @material-ui/core

// with yarn
yarn add @material-ui/core

이것은 MUI의 새로운 리액트 버전에서의 문제입니다.그들은 새로운 버전의 Material UI를 출시하기 위해 노력하고 있습니다.그동안 --legacy-peer-deps를 사용하여 이 문제를 해결할 수 있습니다.

다음은 https://namespaceit.com/blog/mui-installation-doesnt-work-with-react-18 입니다.

npm install @mui/material @emotion/react @emotion/styled --legacy-peer-deps
npm install @mui/icons-material --legacy-peer-deps

react 18과 함께 새 버전의 재료 UI를 사용해야 합니다.

다음 명령을 사용하여 새 버전을 설치하려면 다음과 같이 하십시오.

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

// with yarn
yarn add @mui/material @emotion/react @emotion/styled

에 사용하였습니다.--force깃발과 그것은 나에게 효과가 있었다.

npm install @material-ui/core

언급URL : https://stackoverflow.com/questions/71713111/mui-installation-doesnt-work-with-react-18