No Icons showing

[AndreasVolkmann]

Hi I just tried this out and couldn't make it work.

I used the following code:

import React, {PropTypes} from "react";
import FontAwesome from "react-fontawesome"

<span><FontAwesome name="briefcase"/>Working Specialty</span>

This is what gets rendered:

<span>
    <span aria-hidden="true" class="fa fa-briefcase"></span>
    <!-- react-text: 41 -->Working Specialty<!-- /react-text -->
</span>

Am I missing something? No Icon shows up.

[danawoodman]

Did you include the FontAwesome font in your project somewhere?

[AndreasVolkmann]

Yes I used npm i and imported it via webpack.

[danawoodman]

If you inspect it in the browser what do you see? Can you look in developers tools and see the assets loading for the FontAwesome fonts?

[je553]

I had this same issue, but after adding a <link /> to the fontawesome stylesheet to my main html app container, it worked fine. Let me know if this works for you!

[danawoodman]

@je553 yeah, this React component does not include the CSS or fonts so that is to be expected 😄

Closing as I assume that was the issue

[huyle2607]

I just tried and all you need to do is to include the FontAwesome stylesheet into your index.html file. Thanks for your help @je553

[wizzfizz94]

Is this part of the readme or on the npm page anywhere? Seems like an important stepup step that isn't addressed in docs.

[danawoodman]

@wizzfizz94 yes, this is right below the install section of the README:

[wizzfizz94]

oh silly me :man_facepalming: Any recommended guides on configuring a local version with css and fonts locally?

[danawoodman]

If you’re using Font Awesome 5, you should use the official React component.

If you’re using WebPack, please check the readme under setup.

If you’re using something else, what would that be?