Home  >  Q&A  >  body text

Missing import of material-ui search icon

import React from 'react'
import {Search} from "@material-ui/icons/Search"
const App = () => {
  return (
    <div>
    <Search/>
    </div>
  )
}
export default App

Export 'search' (imported as 'search') not found in '@material-ui/icons/Search' (possible export: __esModule, default)

Export 'search' (imported as 'search') not found in '@material-ui/icons/Search' (possible export: __esModule, default)

The search icon is not imported, but I installed the material package, but it is not displayed in package.json

P粉208469050P粉208469050222 days ago454

reply all(2)I'll reply

  • P粉349222772

    P粉3492227722024-04-03 10:44:55

    If you look carefully at your import declaration

    mistake:/!\

    import { Search } from "@material-ui/icons/Search
    

    You are importing a module named "Search", which already has a default export.
    In order to use the default export you should use

    Work:

    import Search from "@material-ui/icons/Search
    

    If you want to import multiple icons, you should use route /icons,
    Then use all the icons you want, here's how to achieve this:

    Work:

    import { Search, Mail } from "@material-ui/icons
    

    Install and run:

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

    reply
    0
  • P粉451614834

    P粉4516148342024-04-03 00:08:40

    The correct import is:

    import SearchIcon from '@mui/icons-material/Search';

    You must install it if you haven’t already

    npm i @mui/icons-material

    You can find all icons here: https://mui.com/material -ui/material-icons/

    reply
    0
  • Cancelreply