Si encuentras algún detalle que no entiendes puedes dejarlo en los comentarios y haremos todo lo necesario de ayudarte lo más rápido posible.
Solución:
Oye, acabo de encontrarme con el mismo problema y me volvió loco durante la última hora más o menos jaja. Básicamente, han dividido todos los increíbles iconos de fuentes en sus propios “paquetes” o algo así. Creo que hay cuatro categorías como se ve en su sitio web en la barra lateral cuando hace clic en la pestaña ‘iconos’. Ellos son Solid, Regular, Light, and Brands.
Para el ícono de GitHub, está en el paquete de marcas, por lo que todo lo que necesita hacer para solucionarlo es instalar el paquete de marca con yarn o npm e importarlo.
$ yarn add @fortawesome/free-brands-svg-icons
Luego, en el componente .js, desea agregar sus íconos
import React, Component from 'react';
import FontAwesomeIcon from '@fortawesome/react-fontawesome';
import faCoffee from '@fortawesome/free-solid-svg-icons';
import faGithub from '@fortawesome/free-brands-svg-icons'
class Main extends Component
render()
return(
Hello Main!
aquí incluí tanto el ícono de café como el ícono de github para mostrar dos íconos diferentes.
Esto me lleva a creer que lo siguiente debería funcionar para cualquiera de los íconos en Font Awesome…
yarn add @fortawesome/free-[ICON PACKAGE]-svg-icons
y luego
import [ICON NAME] from '@fortawesome/free-[ICON PACKAGE]-svg-icons';
pero no estoy del todo seguro. De todos modos, ¡espero que esto haya ayudado!
¡Salud!
ACTUALIZAR:
Para cualquiera que pueda tropezar con este problema similar en el futuro, en realidad sugeriría usar el react-icons paquete npm. Contiene un gran paquete de fuentes de íconos populares (incluido FontAwesome) y también cuenta con la importación de solo lo que necesita. Puede consultarlo en https://react-icons.netlify.com/#/
Comentarios y puntuaciones del post
No se te olvide recomendar esta reseña si te fue de ayuda.