fontawesome is not working with react

Question

I'm trying to use FontAwesome with React.js but it is not working.

In Button.js I have:

import React from "react";
import FontAwesome from "react-fontawesome";
const Button = () => {
   return <FontAwesome name="rocket" />;
};
export default Button;

and in index.html I included the FontAwesome CDN: https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css

Any suggestions?

Check this may be it will solve you issue: https://stackoverflow.com/questions/23116591/how-to-include-a-font-awesome-icon-in-reacts-render — Mayank Shukla, Jul 28 '17 at 07:33

score 0 · Answer 1 · answered Jul 28 '17 at 08:05

There's not a problem with react-fontawesome package, but the problem is in your react code, you are write return FontAwesome component outside of function, your react apps will not work.

Look this Button component with font-awesome, don't forget for import React in Button.js, and ofcourse import font-awesome css in your index.html.

import React from "react";
import FontAwesome from "react-fontawesome";
const Button = () => {
    return <FontAwesome name="rocket" />;
};
export default Button;

Then you just need to import Button from Button.js

...
import Button from "./Button";

...
<Button />
...

actually, I did all this stuff. I just did not write that down! Now i have edited my answer! — stochazesthai, Jul 28 '17 at 08:46

fontawesome is not working with react

1 Answers1