React Can't Find An Import For Material UI Components

user_13469549 0
Viewed 589

I am trying to use material ui components but react throws an invalid import error

This is My Component File's Code

import React from 'react'
import './middle.css'
import MicIcon from '@material-ui/icons/Mic';
function Middle() {
    return (
        <div>
            <MicIcon />
            <input type='text'/>
        </div>
    )
}

export default Middle

This Is The Error I'm Getting

Failed to compile.

./src/components/pages/home/components/middle/middle.js
Module not found: Can't resolve '@material-ui/icons/Mic' in '/home/freduah/GoogleClone/google-clone/src/components/pages/home/components/middle'
material-ui reactjs html javascript
2 Answers

Did you install @material-ui/icons package? It's a separate package for Material-UI icons alongside with @material-ui/core. Remember to restart the server after installing and you should be fine.

user_94494260

You must have forgotten to install the material-ui icon package. Try following:

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

// with yarn
yarn add @material-ui/icons
user_13540870
Related