React-redux-starter-kit: Font-Awesome

[jorgecarmona]

Does this kit come with font-awesome?

If not, where would I add it after getting the dependencies from npm?

Thanks!

[neverfox]

Just import it into core.scss:

@import "~font-awesome/scss/font-awesome";

or

@import "~Font-Awesome/scss/font-awesome";

(depending on how it was imported with npm)

[jorgecarmona]

Thanks for the answer. I did do it the way you suggest it.

[emptyway]

I did what you suggested, and but having path issues. seems that font-awesome can't find its fonts folder.. Any idea what am I missing? Thanks!

ERROR in ./~/css-loader?sourceMap&-minimize&modules&importLoaders=1&localIdentName=[name]__[local]___[hash:base64:5]!./~/postcss-loader!./~/sass-loader?sourceMap!./src/styles/core.scss
Module not found: Error: Cannot resolve 'file' or 'directory' ../fonts/fontawesome-webfont.eot in /Users/simon/CowBook/CowBook-Web-App/src/styles
 @ ./~/css-loader?sourceMap&-minimize&modules&importLoaders=1&localIdentName=[name]__[local]___[hash:base64:5]!./~/postcss-loader!./~/sass-loader?sourceMap!./src/styles/core.scss 6:201950-202001

[johnjerrico]

edit the $fa-font-path inside the _variable.scss inside the node-modules/font-awesome/scss
from '../fonts' to './fonts' and placed the fonts inside the your style folder

[ajwagner777]

@simonlinj did you find a solution? Everything else I have seen has seemed hacky.

[jmschneider]

danwad's solution from #474 for bootstrap-sass works for me here as well. Once you follow his directions to set up src/styles/global/global.scss outside of CSS module, add the following:

$fa-font-path: "~font-awesome/fonts";
@import "~font-awesome/scss/font-awesome";

[gkaran]

This seems like a lot of work for something that should be a lot easier. Simply importing the appropriate file should be sufficient. Perhaps a enhancement is needed here?

[mikedevita]

it doesnt work for me, the fonts dont render at all, no warnings or anything im using..

$icon-font-path: '~bootstrap-sass/assets/fonts/bootstrap/';
$fa-font-path: '~font-awesome/fonts';
@import '~bootstrap-sass/assets/stylesheets/_bootstrap.scss';
@import '~font-awesome/scss/font-awesome.scss';

[alukach]

The following worked for me:

1. Install Font Awesome (yarn add font-awesome)
2. Add to src/styles/core.scss:

$fa-font-path: '~font-awesome/fonts';
@import "~font-awesome/scss/font-awesome";