是否有关于如何在svg-icons文件夹中使用material-ui图标的列表？

Question

我想在nv install中使用svg-icons文件夹中的material-ui图标，但每个js文件上每个图标的实现都有不同的导入，如动作或编辑器中的那些等.I必须通过js文件查找如何导入每个图标。我想要一个文档或网站，专门让我复制粘贴每个图标的导入，这将有很大帮助，提前感谢：）

我正在寻找谷歌设计的**navigate next**图标，并在

中找到它

import ImageNavigateNext from 'material-ui/svg-icons/image/navigate-next';

Answer 1

Pre v1

您只需在https://design.google.com/icons/上查找类别和名称。

每个SvgIcon都会映射到：

import MyIconName from 'material-ui/svg-icons/<category>/<name>';

例如，如果我想要帐户余额图标，这是我要导入的操作类别的一部分。

import BalanceIcon from 'material-ui/svg-icons/action/account-balance';

请注意，空格将变为破折号。所以你想要的列表在上面的链接上。

<强> V1

使用新版本的材料-ui，图标位于自己的包material-ui-icons中。现在你只需要查找名称和 PascalCase 就可以找到正确的名称。该类别不再相关。所以：

import BalanceIcon from 'material-ui/svg-icons/action/account-balance';

变为：

import BalanceIcon from 'material-ui-icons/AccountBalance';

Answer 2

您可以在项目子目录node_modules/@material-ui/icons中搜索图标名称。

ls node_modules/@material-ui/icons/*.js | grep -v 'Outlined' | grep -v 'Rounded' | grep -v 'Sharp' | grep -v 'TwoTone'

node_modules/@material-ui/icons/AccessAlarm.js
node_modules/@material-ui/icons/AccessAlarms.js
node_modules/@material-ui/icons/Accessibility.js
node_modules/@material-ui/icons/AccessibilityNew.js
node_modules/@material-ui/icons/AccessibleForward.js
node_modules/@material-ui/icons/Accessible.js
node_modules/@material-ui/icons/AccessTime.js
node_modules/@material-ui/icons/AccountBalance.js
node_modules/@material-ui/icons/AccountBalanceWallet.js
node_modules/@material-ui/icons/AccountBox.js
node_modules/@material-ui/icons/AccountCircle.js
node_modules/@material-ui/icons/AcUnit.js

Answer 3

您也可以检查以下一项： https://www.materialui.co/icons

Answer 4

material-ui @ v1.0.0-beta.41已弃用且在material-ui @ v1.0.0-beta.42中没有svg-icons模块（material-ui / svg-icons）  因此，要使用现在svg-icons中的模块，我们必须安装material-ui-icons。

  

**我遇到了这个错误，经过搜索后才知道。 **

Module not found:Can't resolve 'material-ui/MenuItem' 

Module not found: Can't resolve 'material-ui/svg-icons/file/file-download' 

Module not found: Can't resolve 'material-ui/svg-icons/content/content-copy'

Module not found: Can't resolve 'material-ui/svg-icons/toggle/star-border'

Module not found: Can't resolve 'material-ui/svg-icons/action/delete' 

Module not found: Can't resolve 'material-ui/svg-icons/image/remove-red-eye';

示例：

  

安装材料-ui @ v1.0.0-beta.42后也安装   material-ui-icons链接：

https://www.npmjs.com/package/material-ui-icons

npm install --save material-ui-icons

  

材料-ui @ v1.0.0-beta.42中没有的模块很少   并且存在于＆＃39; material-ui-icons＆＃39;：

中

// import MenuItem from 'material-ui/MenuItem';//this was used in version material-ui @v1.0.0-beta.41
import { MenuItem } from 'material-ui/Menu';//Now in version material-ui @v1.0.0-beta.42, also need to install material-ui-icons

// import RemoveRedEye from 'material-ui/svg-icons/image/remove-red-eye';
import RemoveRedEye from 'material-ui-icons/RemoveRedEye';

import PersonAdd from 'material-ui-icons/PersonAdd';

// import ContentCopy from 'material-ui/svg-icons/content/content-copy';
import ContentCopy from 'material-ui-icons/ContentCopy';

// import Download from 'material-ui/svg-icons/file/file-download';
import FileDownload from 'material-ui-icons/FileDownload';

// import Delete from 'material-ui/svg-icons/action/delete';
import Delete from 'material-ui-icons/Delete';

// import StarBorder from 'material-ui/svg-icons/toggle/star-border';
import StarBorder from 'material-ui-icons/StarBorder';

Answer 5

这是图标https://material.io/tools/icons/?style=baseline的官方列表