FontAwesome SCSS Tree-Shaking

Question

с использованием метода, описанного в https://fontawesome.com/how-to-use/on-the-web/using-with/sass Я полагаю, что в итоге я накоплю почти 2,8 МБ веб-шрифтов в папке src моего проекта React. Мне нужно использовать CSS для добавления иконок в стиль календаря, но не повлияет ли это на дрожание дерева? Другими словами, не получится ли у меня огромный размер пакета только для одного значка?

Answer 1

Представленный метод @Mike Poole является наиболее правильным для встряхивания деревьев. Если вы используете метод webfont, у вас нет выбора, кроме как загрузить весь набор. Но если вам нужно использовать всего несколько значков и по какой-то причине вы не можете загрузить их через js, вы можете просто получить нужные файлы svg и добавить их напрямую, либо <img> тегами, либо фоновыми изображениями.

Answer 2

Встряхивание деревьев с помощью FontAwesome не вызывает затруднений. Если вы используете только один значок, вам нужно только импортировать этот значок (и, конечно, для этого не нужно использовать SASS).

Вот пример, который FontAwesome использует, если вы хотите использовать толькосплошной fa-coffee значок:

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