Package Exports

fontawesome.macro

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (fontawesome.macro) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

fontawesome.macro

Description

This babel macro enables fontawesome icons to be imported automatically when using the following tagged template/function syntax

Before:

import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
import { faSquare } from '@fortawesome/free-solid-svg-icons'


<FontAwesome icon={faSquare} />

After:

import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
import { fas } from 'fontawesome.macro'

<FontAwesome icon={fas`square`} />
// or
<FontAwesome icon={fas('square')} />

Usage

https://github.com/kentcdodds/babel-plugin-macros/blob/master/other/docs/user.md

Read the above doc to enable babel macros. If you are using create-react-app, babel macros are enabled by default so you should be able to import this macro without configuring anything.

You can use the following tagged template/function macros:

fal -> light
fas -> solid
fab -> brands
fad -> duotone (pro only)

You can specify free or pro in the babel plugin macro config. The below config enables use of pro icons(by default this macro uses free icons).

// babel-plugin-macros.config.js
module.exports = {
  // ...
  'fontawesome.macro': {
    type: 'pro'
  }
}

Note that you need to install svg font packages you want to use in your project by yourself.

https://fontawesome.com/how-to-use/with-the-api/setup/importing-icons

yarn add @fortawesome/free-solid-svg-icons @fortawesome/free-regular-svg-icons	@fortawesome/free-brands-svg-icons