how to use fontawesome in gatsby

1npm i --save @fortawesome/fontawesome-svg-core
2npm i --save @fortawesome/free-solid-svg-icons
3npm i --save @fortawesome/react-fontawesome
4
5import React from 'react'
6import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
7import {
8  faCoffee,
9  faAddressBook,
10  faAirFreshener,
11  faAmbulance,
12  faAtom,
13  faBus,
14  faCoins,
15  faDice,
16} from '@fortawesome/free-solid-svg-icons'
17
18const IndexPage = () => (
19  <main
20    style={{
21      maxWidth: '608px',
22      margin: '0 auto',
23    }}
24  >
25    <h1 style={{ textAlign: 'center' }}>
26      Gatsby Font Awesome example
27    </h1>
28    <div>
29      <FontAwesomeIcon icon={faCoffee} size="1x" />
30      <FontAwesomeIcon icon={faAddressBook} size="2x" />
31      <FontAwesomeIcon icon={faAirFreshener} size="3x" />
32      <FontAwesomeIcon icon={faAtom} size="4x" />
33      <FontAwesomeIcon icon={faAmbulance} size="5x" />
34      <FontAwesomeIcon icon={faBus} size="6x" />
35      <FontAwesomeIcon icon={faCoins} size="7x" />
36      <FontAwesomeIcon icon={faDice} size="8x" />
37    </div>
38  </main>
39)
40
41export default IndexPage