Question

我尝试安装react图标，在我的应用程序中运行了npm命令：

sudo npm install react-icons --save

除了一些可选的依赖项之外，我没有得到任何错误

npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.4 
(node_modules/fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for 
fsevents@1.2.4: wanted {"os":"darwin","arch":"any"} (current: 
{"os":"linux","arch":"x64"})

每当我尝试导入某些图标时，都会出现错误

./src/components/SkiDaysCount.js
Module not found: Can't resolve 'react-icons/lib/md' in ' 
'/home/kristoffer/ReactApps/navbar/src/components'

这是我的进口货

import {Terrain} from 'react-icons/lib/md'
import {SnowFlake} from 'react-icons/lib/ti'
import {Calender} from 'react-icons/lib/fa'

为什么会出现此错误？

编辑：

我还尝试使用旧的语法进行导入，但存在相同的问题：

import Calender from 'react-icons/lib/fa/calender'

Answer 1

使用v3方式导入图标时，lib不应成为导入路径的一部分。

图标还具有图标库名称作为导出的前缀。

import { FaCalendar } from 'react-icons/fa'

Answer 2

浏览完图标目录react-icons / [fa，ti，md]并查看index.dt.ts文件中的图标新名称后，我想到了答案。

import { MdTerrain } from "react-icons/md";
import { TiWeatherSnow } from "react-icons/ti";
import { FaCalendarAlt } from "react-icons/fa";

要在组件中使用图标，请使用标签：

<FaCalendarAlt />
<TiWeatherSnow />
<MdTerrain />

有关说明，请查看react-icon页面上的从版本2-> 3迁移。 https://www.npmjs.com/package/react-icons

Answer 3

并非所有fa图标都是免费的。尝试按以下方式导入铅笔的付费图标时出现此错误。

import { FaPencil } from 'react-icons/fa'

如果所有fa图标都显示here，则可以看到pencil需要pro license。

由于我没有专业许可证，因此出现了错误。但是我们总是可以使用免费的versions of pencil，我们只需要按如下所示导入它即可。

import { FaPencilAlt } from 'react-icons/fa'
<button><FaPencilAlt /></button>

您还应该从here检查版本的实现。

Answer 4

如果您已安装3.0.5版本的react-icons，请尝试：

对于铅笔（编辑）：

import {FaPencilAlt} from 'react-icons/fa'

对于垃圾箱（删除）：

import {FaTrash} from 'react-icons/fa'

Answer 5

import {FaHiking, FaRightAlign,...} from 'react-icons/fa'

从v3版本的反应图标库“ / libname”开始是必需的。

libname为'fa'-> fontawesome，'fi'-> feathericons。有关更多信息，请访问

https://react-icons.netlify.com/#/

Answer 6

这也可能是拼写错误引起的。说

import {Haiking) from 'react-icons/fa'

代替

import {Hiking) from 'react-icons/fa'

Answer 7

也许您必须更新“反应图标”包。命令：npm更新react-icons

使用react-icons时导入错误

7 个答案: