Can't show icon with fontawesome's react-js library

user_14137122 0
Viewed 161
import "./App.css";
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'

function App() {
return (
<div className="container">
  <input type="text" className="form-control" placeholder="Ara..." id="search_input"> 
</input>
  <button type="button" className="btn btn-light" id="search_button"><FontAwesomeIcon 
icon="search" /></button>

  <button type="button" className="btn btn-primary" id="buttons">E-Twinning</button>
  <button type="button" className="btn btn-primary" id="buttons">Erasmus</button>
</div>
 );
 }

export default App;

I need to help about this. I have a png and svg file in background I tried show to svg and png files but it didn't work. I tried both method like as above and both working wrong.

font-awesome bootstrap-4 reactjs html javascript
1 Answers

To use string in the icon prop ( the way you are using), you need to add those icons using library.add() to make it work.

Read more here. Check section "Using Icons via Global Use"

One other way is to import individual icons and use them.

import { faSearch } from "@fortawesome/free-solid-svg-icons";

<FontAwesomeIcon icon={faSearch} />

user_21579070
Related