React-fontawesome: Importing the same icon from different icon sets

[mattgogerly]

Let's say I want to import the heart icon from the free-regular and free-solid packages. How can I do this if they're both exported as "faHeart" - you have a duplicate declaration?

For instance:

import { faHeart } from '@fortawesome/free-solid-svg-icons';
import { faHeart } from '@fortawesome/free-regular-svg-icons';

[adriendomoison]

You can use 'as'
import { faHeart as faSolideHeart } from '@fortawesome/free-solid-svg-icons';
import { faHeart as faRegularHeart } from '@fortawesome/free-regular-svg-icons';
👍

[robmadole]

Yep, @adriendomoison has the answer.

We have docs here: https://fontawesome.com/how-to-use/with-the-api/setup/importing-icons

[victorbruce]

How do you display the regular icon after loading the icons from two different libraries(solid, regular) if all icons are stored in a single fontawesome file

import { library } from '@fortawesome/fontawesome-svg-core';
import { faHeart } from '@fortawesome/free-solid-svg-icons';
import { faHeart as farHeart } from '@fortawesome/free-regular-svg-icons';

library.add(faHeart, farHeart)

How can I display the regular icon if the code below is called in another file?