Module not found: Can't resolve '@mui/material/utils' : (v5, which included a name change.)

Question

I can see this error when I attempted to import some Icons from material-ui. I installed some modules as advised, but still not fixed.

package.json

    "@material-ui/core": "^4.12.3",
    "@mui/icons-material": "^5.0.1",
    "@mui/lab": "^5.0.0-alpha.49",

I attempted to install /utils by using the following command,

$ npm install @mui/material/utils

ERROR:

npm ERR! code ENOLOCAL
npm ERR! Could not install from "@mui\material\utils" as it does not 
contain a package.json file.

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\Han\AppData\Roaming\npm-cache\_logs\2021-10-03T21_47_03_649Z-debug.log

Is there anything I missed?

**After some reserch, I removed "@material-ui/core" and install "@mui/core" instead. I assume this error comes up since there is name changed from material to mui?

    "@mui/core": "^5.0.0-alpha.49",
    "@mui/icons-material": "^5.0.1",
    "@mui/lab": "^5.0.0-alpha.49",
    "@mui/utils": "^5.0.1",

Thanks.

Answer 1

Try this command npm install @mui/material @emotion/react @emotion/styled

Answer 2

Explanation

This error happens when installing the MUI icons package before installing the MUI component library. The MUI icons package needs @mui/material @emotion/react @emotion/styled packages to work properly.

Solution

Run one of the following lines

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

// or if you prefer yarn
yarn add @mui/material @emotion/react @emotion/styled

Answer 3

Try to install the main package.

 npm i @mui/material

This will definitely solve your problem