javascriptreactjsreact-font-awesome

Social Media font awesome icon is not working in react js

ERROR

Attempted import error: 'faTwitter' is not exported from '@fortawesome/free-solid-svg-icons'.

I'm using font awesome icons in react js there are few icons is working like:- faPhoneAlt, faHeart, faBars, faChevronDown

but social media icons are not working.

Code

import React, {Component} from 'react';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import {faMapMarkerAlt, faPhoneAlt, faShoppingBag, faHeart, faBars, faChevronDown, faTwitter} from '@fortawesome/free-solid-svg-icons';


<FontAwesomeIcon icon={faTwitter} /></Link>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script>

Solution

  • For that, you need to install free-brands-svg-icons

    https://www.npmjs.com/package/@fortawesome/free-brands-svg-icons

    In the doc it's clearly mentioned that for brands aka social media, you must to use another package.

    https://fontawesome.com/how-to-use/on-the-web/using-with/react