Module not found: Error: Can't resolve '@material-ui/core' in 'C:\Users\Meenakshi\OneDrive\Documents\react apps\memories\client\src'

Question

I was working on a web application which uses MERN. I have installed @material-ui/core but it is throwing an error like Module not found: Error: Can't resolve '@material-ui/core' in 'C:\Users\Meenakshi\OneDrive\Documents\react apps\memories\client\src' My import files are-

import React from "react";
import { Container, AppBar, Typography, Grow, Grid } from "@material-ui/core";
import memories from "./images/memories.png";

And the dependencies looks like-

"dependencies": {
"@testing-library/jest-dom": "^5.16.5",
"@testing-library/react": "^13.3.0",
"@testing-library/user-event": "^13.5.0",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-scripts": "5.0.1",
"web-vitals": "^2.1.4"
}

I'm importing it using the command-

    $ npm install @material-ui/core

and have also tried-

    $ npm install i @material-ui/core

Answer 1

Instead of importing whole material ui core, you can import specifically what you need.

for version 4.x Examples:

import { makeStyles } from '@material-ui/core/styles';

import { Box, Grid } from '@material-ui/core';

and in your package.json

"@material-ui/core": "^4.11.0",

if using version 5.x

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

import Button from '@mui/material/Button';