question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Document how to use the same icon from different sets

See original GitHub issue

I think @jeitneir’s excellent comment on #77 about how to import an icon with an alias should be incorporated into the documentation. Perhaps I’m just stupid, but it took me a while to work out how to use check circle from both the solid and the regular set.

to be clear, this is a copy of @jeitneir’s example from #77

import {
  faEdit
} from '@fortawesome/fontawesome-free-solid'

import {
  faEdit as faEditRegular
} from '@fortawesome/fontawesome-free-regular'

fontawesome.library.add(
  faEdit,
  faEditRegular
)

Issue Analytics

  • State:closed
  • Created 5 years ago
  • Reactions:12
  • Comments:10 (3 by maintainers)

github_iconTop GitHub Comments

8reactions
NJM8commented, Nov 19, 2018

I’d like to add to this for those who find it, and as a suggestion in the documentation, when you use the same icons from different libraries and you alias the import, you do not use the alias in your icon usage, you still use the regular name.

import { faStar } from "@fortawesome/pro-regular-svg-icons/faStar";
import { faStar as faStarSolid } from "@fortawesome/pro-solid-svg-icons/faStar";

library.add(
  faStar,
  faStarSolid
);
          <font-awesome-icon 
            :icon="['fas', 'star']"/>
          <font-awesome-icon 
            :icon="['far', 'star']"/>
3reactions
Adavocommented, Dec 19, 2018

This is gold. Please add this to the doc ASAP. I cannot recover the time stupidly spent on finding how to do so but it can save next one’s time 😃

Read more comments on GitHub >

github_iconTop Results From Across the Web

Importing same icon from different style with icon library ...
but there is no example how to import same icon from different styles. I did it like this: import { faHome as falHome...
Read more >
Insert icons in PowerPoint - Microsoft Support
Choose an icon and then select Insert at the lower right. Insert multiple icons at the same time by choosing each of them...
Read more >
Stacking Icons | Font Awesome Docs
Set up with Font Awesome in your project. ... To stack multiple icons, use the fa-stack class on the parent HTML element of...
Read more >
How to set document icon instead of application ... - Super User
Not all programs provide a document icon, but you can use any .ico , .dll , .exe or icon library ( .icl )...
Read more >
Change icons for files or folders on Mac - Apple Support
Use an icon from another file or folder · At the top of the Info window, click the small icon. The Info window...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found