使用Material响应依赖冲突18.0版本

Question

我在这里试过所有的建议，但都没有用。Issue with Material UI Icons npm installation : unable to resolve dependency tree和下面的这个：create-react-app dependency version issues with React 18，请做些什么来解决这个问题？下面是我的package.lock.json。

​

     "name": "cashflowbr",
  "version": "0.1.0",
  "lockfileVersion": 2,
  "requires": true,
  "packages": {
    "": {
      "name": "cashflowbr",
      "version": "0.1.0",
      "dependencies": {
        "@emotion/react": "^11.9.0",
        "@emotion/styled": "^11.8.1",
        "@fontsource/roboto": "^4.5.5",
        "@mui/icons-material": "^5.6.2",
        "@mui/material": "^5.6.2",
        "@testing-library/jest-dom": "^5.16.4",
        "@testing-library/react": "^13.1.1",
        "@testing-library/user-event": "^13.5.0",
        "react": "^17.0.2",
        "react-dom": "^17.0.2",
        "react-scripts": "5.0.1",
        "web-vitals": "^2.1.4"
      }

​

Answer 1

在安装MUI版本5时，我似乎正在尝试导入MUI版本4组件。

您的导入应该来自@mui/material (版本5)，而不是来自@material-ui/core (版本4)。

备选案文1

将导入更改为使用已安装的库(@mui/material)，例如：

import AppBar from '@mui/material/AppBar';
import Box from '@mui/material/Box';
import Toolbar from '@mui/material/Toolbar';
import Typography from '@mui/material/Typography';
import Button from '@mui/material/Button';
import IconButton from '@mui/material/IconButton';
import MenuIcon from '@mui/icons-material/Menu';

选项2

将package.json更改为安装MUIv4。

移除：

"@emotion/react": "^11.9.0",
"@emotion/styled": "^11.8.1",
...
"@mui/icons-material": "^5.6.2",
"@mui/material": "^5.6.2",

..。并增加：

"@material-ui/core": "4.11.3",
"@material-ui/icons": "4.11.3",

最后，运行npm install。如果在此之后有任何问题，请删除node_modules文件夹，然后再删除npm install。