FontAwesome 5 NPM иконки - PullRequest
Новая
       20

FontAwesome 5 NPM иконки

0 голосов
/ 12 июня 2018

Я пытаюсь внедрить FontAwesome5 на мой сайт с помощью NPM и Webpack.Вот мой код: 

import fontawesome from '@fortawesome/fontawesome'
import faFacebookF from '@fortawesome/fontawesome-free-brands/faFacebookF'
import faYoutube from '@fortawesome/fontawesome-free-brands/faYoutube'
import faInstagram from '@fortawesome/fontawesome-free-brands/faInstagram'

fontawesome.library.add(faYoutube)
fontawesome.library.add(faFacebookF)
fontawesome.library.add(faInstagram)

Ситуация такова: работает только первый значок, добавленный с fontawesome.library.add, а другие - нет.В этом примере отображается только иконка Youtube, а другие выглядят так:

enter image description here

Если я просто изменю порядок и поставлю иконку Facebook наверх, вот так: 

import fontawesome from '@fortawesome/fontawesome'
import faFacebookF from '@fortawesome/fontawesome-free-brands/faFacebookF'
import faYoutube from '@fortawesome/fontawesome-free-brands/faYoutube'
import faInstagram from '@fortawesome/fontawesome-free-brands/faInstagram'

fontawesome.library.add(faFacebookF)
fontawesome.library.add(faYoutube)
fontawesome.library.add(faInstagram)

Так будет работать только значок Facebook:

enter image description here

Других изменений в JS или HTML не было, простопорядок значков.Если я поставлю в верхней части другую иконку, которая не используется в моем HTML - все 3 иконки будут пусты

Не могли бы вы помочь мне с этой странной проблемой?

PS вообще нет проблем с js в devtools или в веб-пакете

1 Ответ

0 голосов
/ 12 июня 2018

Поскольку использовалась только одна упаковка - 'fontawesome-free-брендов', вы должны использовать список, разделенный комой, вот так: 

fontawesome.library.add(faFacebookF,faYoutube,faInstagram)
...