Некоторые значки в react-icon выдают ошибку импорта

#reactjs

#reactjs

Вопрос:

Я установил react-icons, и некоторые значки, такие как FaBeer , FaBed работают, но многие из них ( FaPencil , FaFloppyO FaCalendarTimesO ) генерируют следующую ошибку. ./src/Note.js
Attempted import error:
'FaClose' is not exported from 'react-icons/fa'.

  1. Почему я получаю эту ошибку?
  2. Существует ли премиальная (или что-то вроде) версия react-icons?

PS: Это проект ReactJS, и у меня есть свежая установка всего.

Ответ №1:

Версия значков FontAwesome, используемых в текущем react-icon пакете, является 5.4.0 бесплатной версией. Некоторые значки, к которым вы, возможно, пытаетесь получить доступ, недоступны в этой версии.

Например, FaPencil является частью pro пакета FontAwesome (платная версия). Однако вы можете попробовать FaPencilAlt вместо этого — этот доступен и работает.

floppy-o Я полагаю, это очень старый значок, который теперь был заменен в текущей версии на FaSave , который доступен в react-icons ?

FaCalendarTimes также доступен, но больше не () calendar-times-o

Список бесплатных значков FontAwesome должен помочь вам узнать, какие значки доступны вам в react-icons .


Если вы хотите обойти использование react-icons и вместо этого хотели бы использовать значки FontAwesome непосредственно в вашем проекте react, то я бы рекомендовал использовать react-fontawesome пакет. Это позволяет добавлять бесплатные иконки или также иконки pro (если вы заплатили за пакет pro от FontAwesome, то есть). Он также включает в себя некоторые функциональные возможности для настройки ваших значков, которые специфичны для FontAwesome — это функциональность, которую вы бы не получили react-icons , которая работает над созданием общего универсального пакета для различных пакетов значков.

Ответ №2:

Вы получаете ошибку, потому что вы импортируете значки с неправильным именем. Для pencil это FaPencilAlt

Проверьте их официальный веб-сайт для получения дополнительных значков

 import { FaBeer, FaPencilAlt, FaCalendarTimes } from "react-icons/fa";
  

Проверьте эту ссылку на Codepen для других значков