Я пытаюсь использовать значки брендов из Font Awesome, я уже использовал их ранее в приложении vue, это немного отличается от использования обычных значков svg, поскольку библиотека брендов отделена от обычных значков svg.Вот как я использовал в приложении VUE.
// imports in the main.js file
import { library } from '@fortawesome/fontawesome-svg-core';
import { faCoffee } from '@fortawesome/free-solid-svg-icons';
import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome';
import { faFacebookF } from '@fortawesome/free-brands-svg-icons';
library.add(faCoffee, faFacebookF);
Vue.component('fa-icon', FontAwesomeIcon)
// usage in a vue component - regular svg icons
<fa-icon icon="coffee" />
// brand icon
<fa-icon class="ic right" :icon="['fab', 'facebook-f']" />
Сейчас я пытаюсь сделать подобное в приложении реагирования, но я немного застрял на том, где и как его импортировать и использовать. В Vue я определил<fa-icon />
глобально в моем main.js
, но с React все немного по-другому.вот моя попытка в реактивном компоненте.
// imports in my app.js file
import React from 'react';
import { library } from '@fortawesome/fontawesome-svg-core';
import { faCoffee } from '@fortawesome/free-solid-svg-icons';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { faFacebookF } from '@fortawesome/free-brands-svg-icons';
library.add(faCoffee, faFacebookF)
//this works
<FontAwesomeIcon icon="coffee" />
//this does not
<FontAwesomeIcon icon={"['fab', 'facebook-f']"} />
спасибо заранее.