SearchOutlined”

【问题标题】：Module not found: Error: Can't resolve '@mui/icons-material/SearchOutlined'未找到模块：错误：无法解析“@mui/icons-material/SearchOutlined”
【发布时间】：2022-01-16 16:22:59
【问题描述】：

我已经安装了图标和核心的软件包，但仍然出现此错误，为什么？？

import React from 'react'
import './Nav.css';
import SearchOutlinedIcon from '@mui/icons-material/SearchOutlined';

function Nav() {
    return ( 
        <div className = 'header' >
            <div className="header_left">
                <img className = 'header_image' src='https://cdn-icons-png.flaticon.com/512/174/174857.png' alt='' />
                <div className="header_search">
                    {/* Search icon */}
                    <SearchOutlinedIcon/>
                    <input type = 'text' placeholder='search' />
                </div>
            </div>
        </div>
    )
}

export default Nav

【问题讨论】：

你试过“npm install @mui/icons-material”吗？
是的。我试过了。终端显示安装成功，但是package.json中没有显示模块名称。

标签： reactjs material-ui jsx modulenotfounderror

【解决方案1】：

问题中缺少很多细节，但这是我的看法：

我目前正在使用 npm v7.24.1，并且我在 package.json 中列出了相同的依赖项

"@mui/icons-material": "5.2.0"

当我在这样的组件中使用它时效果很好

import { SearchOutlined } from '@mui/icons-material';

考虑到您的问题下的评论，很遗憾我无法回复，您确定您在 package.json 所在的同一目录中运行 npm install 吗？因为除非你的 npm 版本小于 5，否则 npm install @mui/icons-material 必须影响 package.json（和 package-lock.json）。如果您的 npm 版本小于 5，请在 npm install 命令中使用 --save 标志。使用“npm -v”验证 npm 版本。

您可以做的另一件事是检查 @mui/icons-material 是否存在于 node_modules 文件夹中。如果没有，请尝试手动将 @mui/icons-material 添加到 package.json 的依赖项部分，然后在同一目录下运行 npm install。

【讨论】：