Which one font awesome in react app using cdn or npm

Question

im really confused what is the best way to integrate fontawesome to reactjs web app using CDN or installing NPM for production ecommerce i also use webpack for react

score 1 · Answer 1 · answered Jul 22 '21 at 06:32

1

I suggest npm.. react font awesome icon

answered Jul 22 '21 at 06:32

Avani Bataviya

750
1
6
20

score 1 · Answer 2 · answered Jul 22 '21 at 06:45

1

CDN is basically another request to some server. Since, your browser can run concurrently process only 5 requests using more cdn makes browser bit slower at first.

I prefer to use npm package for react

answered Jul 22 '21 at 06:45

NEWGIN SAM

129
2
7

score 1 · Accepted Answer · answered Jul 22 '21 at 07:00

You can use Fontawesome npm package. When you use npm package, just used icons will add to your component. This help page size while loading.

Step 1 ) Add packages with npm:

npm i --save @fortawesome/fontawesome-svg-core
npm install --save @fortawesome/free-solid-svg-icons
npm install --save @fortawesome/react-fontawesome

Or for free regular icons:

npm install --save @fortawesome/free-regular-svg-icons

Step 2 ) Import fontawesome to your component:

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

Step 3 ) Import icon that you need:

import { faCoffee } from '@fortawesome/free-solid-svg-icons'

Step 4 ) Add jsx tag where you want in return function in component:

<FontAwesomeIcon icon={faCoffee} />

Which one should i use for free icons step 1 or step 2 – Harshit Singh Jul 22 '21 at 07:56 — Harshit Singh, Jul 22 '21 at 07:56
For free icons, do it step by step. All steps. – Danial Jul 22 '21 at 09:17 — Danial, Jul 22 '21 at 09:17

Which one font awesome in react app using cdn or npm

3 Answers3