How to make Font awesome 5 work with webpack

Question

I\'m trying to use Fontawesome in my Flask/webpack project.

The craziest thing is some point it worked then stopped, I changed something stupid, it worked again and fina

Answer 1

In my project (HTML Starter with webpack 4.26.1) I added FontAwesome via two variants:

1. Installed and added

I just installed FontAwesome Free (v5.5.0)

npm install --save-dev @fortawesome/fontawesome-free

and I added to index.js

import '@fortawesome/fontawesome-free/js/fontawesome'
import '@fortawesome/fontawesome-free/js/solid'
import '@fortawesome/fontawesome-free/js/regular'
import '@fortawesome/fontawesome-free/js/brands'

Source code / Commit

2. Used with the API / SVG

I installed FontAwesome (svg-core, brands-icons, regular-icons, solid-icons)

npm install --save-dev @fortawesome/fontawesome-svg-core @fortawesome/free-brands-svg-icons @fortawesome/free-regular-svg-icons @fortawesome/free-solid-svg-icons

and I added to JS file

import { library, dom } from '@fortawesome/fontawesome-svg-core'
import { fas } from '@fortawesome/free-solid-svg-icons'
import { far } from '@fortawesome/free-regular-svg-icons'
import { fab } from '@fortawesome/free-brands-svg-icons'

library.add(fas, far, fab) 

dom.i2svg() 

Source code with comments / Commits