Search code examples
javascriptreactjsfont-awesomereact-font-awesome

Why can't I use certain free FontAwesome icons?

I'm working on a React App that uses Font-awesome. I'm able to get icons like the comment bubble working fine with import { faComment } from '@fortawesome/free-regular-svg-icons'. But there are certain icons such as the search icon that don't seem to be importable, despite being free. Does anyone know why there is this discrepancy between icons? What should I do in order to import the search icon? We are already using the <FontAwesomeIcon /> component syntax across the app so I would prefer to avoid <i class="fas fa-search"></i> if possible.

Solution

  • This is working for me:

    import React from "react";
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
import { faSearch } from '@fortawesome/free-solid-svg-icons'

export default function App() {
  return (
    <div className="App">
      <FontAwesomeIcon icon={faSearch} />
    </div>
  );
}