React에 Font Awesome을 적용해보자~

라따뚜이·2022년 4월 13일
0

공식홈페이지을 참고했습니다.

아주 간단합니다.

저는 무료로 제공하는 아이콘을 사용했습니다. pro버전은 추가적인 설치가 필요하면 위의 공식홈페이지에 자세한 내용을 확인할 수 있습니다.
npm i --save @fortawesome/fontawesome-svg-core
npm install --save @fortawesome/free-solid-svg-icons
npm install --save @fortawesome/react-fontawesome

아래 코드는 제가 사용한 예시입니다. 아이콘을 사용할 컴포넌트에 import해줍니다.

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

위의 코드에서 사용하려는 아이콘인 faEye를 import 해주었기 때문에 아래 코드처럼 작성하여 faEye 아이콘을 사용할 수 있습니다.

<FontAwesomeIcon icon={faEye} />

주의점: 사용하려는 아이콘이 import한 라이브러리에 없다면 에러가 발생합니다. 라이브러리를 변경 후 사용하면 에러가 없어집니다.

profile
돈만 준다면 해 노예

0개의 댓글