MUI 安装不适用于 React 18答案

【问题标题】：MUI installation doesn't work with React 18MUI 安装不适用于 React 18
【发布时间】：2022-06-13 08:33:38
【问题描述】：

我试图用我的 react 18.0 项目安装材料 ui 核心和图标，但我不能。该项目是使用最新的 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 文件夹并重新安装它还是不行

【问题讨论】：

当前不支持 React 18，根据错误。
试试yarn add，你也安装MUI版本

标签： reactjs material-ui

【解决方案1】：

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

【讨论】：

【解决方案2】：

用npm install @mui/material @emotion/react @emotion/styled --force安装它

【讨论】：

【解决方案3】：

这是 MUI 新版 react 的问题。他们正在努力发布新版本的 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

【讨论】：

【解决方案4】：

我尝试了以下方法，它对我有用。

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

【讨论】：

【解决方案5】：

我使用了 --force 标志，它对我有用

npm install @material-ui/core

【讨论】：

【解决方案6】：

您可以将 Material UI v5 用于 reactjs 18

或

使用 Reactjs 使 MUI 工作的另一种方法是将 react 的版本降级到 17。

你只需要降级 react 版本和 react-dom 版本到 17 以使其工作。

检查你的 package.json 文件，你会发现 react 和 react-dom 版本为 18，你必须降级版本才能使 mui 与 Reactjs 正常工作。

降级到版本 17 时使用 --force 标志

【讨论】：

【解决方案7】：

试试这个-

npm install @material-ui/core --legacy-peer-deps
npm install @mui/icons-material --legacy-peer-deps

【讨论】：

【解决方案8】：

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

2022.04.24 的实际情况：

material-ui/core v4.12.4
反应 v18.0.0

【讨论】：