Follow

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use
Contact

Module not found: Error: Can't resolve '@mui/icons-material/Menu' in 'D:\

I tried to download

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

after

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

and that all not works
I got only errors

MEDevel.com: Open-source for Healthcare and Education

Collecting and validating open-source software for healthcare, education, enterprise, development, medical imaging, medical records, and digital pathology.

Visit Medevel

enter image description here

My code of the Appbar is simple from ui materials

import * as React from 'react';
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';

export default function Appbar() {
  return (
    <Box sx={{ flexGrow: 1 }}>
      <AppBar position="static">
        <Toolbar>
          <IconButton
            size="large"
            edge="start"
            color="inherit"
            aria-label="menu"
            sx={{ mr: 2 }}
          >
            <MenuIcon />
          </IconButton>
          <Typography variant="h6" component="div" sx={{ flexGrow: 1 }}>
            News
          </Typography>
          <Button color="inherit">Login</Button>
        </Toolbar>
      </AppBar>
    </Box>
  );
}

and main "App.js" file

import './App.css';
import Appbar from './components/Appbar' 


function App() {
  return (
    <div className="App">
      <Appbar/>
    </div>
  );
}

export default App;

The error of the compilation is

Module not found: Error: Can't resolve '@material-ui/core/styles' in 'D:\oop\studentsystem\studentfrontend\src\components'
WARNING in [eslint] 
Failed to compile.

Module not found: Error: Can't resolve '@mui/icons-material/Menu' in 'D:\oop\studentsystem\studentfrontend\src\components'
ERROR in ./src/components/Appbar.js 11:0-48
Module not found: Error: Can't resolve '@mui/icons-material/Menu' in 'D:\oop\studentsystem\studentfrontend\src\components'

webpack compiled with 1 error

I dont know how to solve that problem, because i have just today started to learn React js and frontend generally.
Sorry for my stupidity, help please me, if you can.:)

>Solution :

You have to install the right packages:

npm install @mui/icons-material

@mui and @material-ui are 2 different things

Here is the Guide

Add a comment

Leave a Reply

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use

Discover more from Dev solutions

Subscribe now to keep reading and get access to the full archive.

Continue reading