mstdmstd
mstdmstd

Reputation: 626

Why some font-awesome icons are not rendered

In my laravel 5.7 / Bootstrap 4.1 app I installed font-awesome package with command

npm install font-awesome --save

and in my package.json I have :

"dependencies": {
    ... 
    "font-awesome": "^4.7.0",
    ... 
}

In webpack.mix.js there is line :

mix.copy('node_modules/font-awesome/fonts', 'public/fonts');

In fonts directory I see

nick@nick:project/public/fonts$ ls -la
total 1080
drwxrwxrwx 1 root root   4096 лис  9 14:32 .
drwxrwxrwx 1 root root   4096 лис  6 06:04 ..
-rwxrwxrwx 1 root root 134808 лис  9 14:32 FontAwesome.otf
-rwxrwxrwx 1 root root 165742 лис  9 14:32 fontawesome-webfont.eot
-rwxrwxrwx 1 root root 444379 лис  9 14:32 fontawesome-webfont.svg
-rwxrwxrwx 1 root root 165548 лис  9 14:32 fontawesome-webfont.ttf
-rwxrwxrwx 1 root root  98024 лис  9 14:32 fontawesome-webfont.woff
-rwxrwxrwx 1 root root  77160 лис  9 14:32 fontawesome-webfont.woff2
drwxrwxrwx 1 root root   4096 лис  7 10:16 roboto
drwxrwxrwx 1 root root      0 лип 22 08:07 vendor

The problem is when I try to use these icons, not all of them are rendered. Say icons fa fa-alicorn or fa fa-air-freshener are empty. I select icon from this https://fontawesome.com/icons?d=gallery&q=freshener selector.

You can check it by http://votes.nilov-sergey-demo-apps.tk/admin/dashboard url, under "Icons Samples" block there some some icons which are visible, but some not.

Why? Are these different version of icons in my app?

Thanks!

Upvotes: 2

Views: 1546

Answers (1)

Remul
Remul

Reputation: 8252

The icons that are not displaying are not available in your fontawesome version. You are using fontawesome v4, the missing icons are only available in fontawesome v5.

Here you can find all icons available for v4:

Here you can find the install guide for v5.

Upvotes: 3

Related Questions