问题:未找到模块:无法解析“@mui/icons-material/FileDownload”

我已经安装了@material-ui/core和@material-ui/icons。

我正在尝试从 Material 图标导入 "FileDownloadIcon"。

安装_“@material-ui/core”_:

npm i @material-ui/core

安装 "@material-ui/icons":

npm i @material-ui/icons

这是我尝试导入_“FileDownloadIcon”_的方式:

import FileDownloadIcon from '@mui/icons-material/FileDownload';
<div className="download-file">
        <Button
                variant="contained"
                color="primary"
                onClick={() => getResume()}
            >
            <FileDownloadIcon />
            Download Resume
        </Button>
</div>

但它正在发生这样的错误_“找不到模块:无法解析'E:\frontend\src\component\Details'中的'@mui/icons-material/FileDownload'”_

谁能告诉我问题出在哪里?

解答

FileDownload 图标在 v5 中添加,在 v4 中不存在。您可以在此处搜索 v4 图标。要在旧版 MUI 中使用 v5 图标,只需在此处复制源代码:

function FileDownload(props) {
  return (
    <SvgIcon {...props}>
      <path d="M19 9h-4V3H9v6H5l7 7 7-7zM5 18v2h14v-2H5z" />
    </SvgIcon>
  );
}

编辑: 如果您已经在使用 MUI v5,这意味着您缺少图标包。按照安装指南这里安装:

npm install @mui/icons-material