REACT

리액트_폰트어썸 사용하기. 설치방법 (FontAwesome)

쫑나리 2023. 8. 17. 17:04
728x90
반응형
SMALL

1. npm 설치해주기

$ npm i @fortawesome/fontawesome-svg-core

$ npm i @fortawesome/free-solid-svg-icons @fortawesome/free-regular-svg-icons @fortawesome/free-brands-svg-icons

$ npm i @fortawesome/react-fontawesome


2. https://fontawesome.com/icons/

에서 사용할 아이콘 찾아주기

 

Coding Icons | Font Awesome

Coding icons from Font Awesome, the world's favorite icon library and toolset.

fontawesome.com

Free icons 을 체크하여 무료만 사용해주세요

저는 faBars를 토글에 사용해볼게요.

기본 문법은 <FontAwesomeIcon icon={faBars}  />

이렇게 사용하시면 되는데 꼭 import를 해주셔야합니다.


3. import 해주기

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

 

728x90
반응형
LIST