17: Инструмент за изграждане - IcoMoon - CSS-трикове

Anonim

Терминът „инструмент за изграждане“ може да е страшен. Той напомня за фантастични инструменти на командния ред, изискващи конфигурация и странни системни зависимости, които се прекъсват, когато ги гледате погрешно. Понякога инструментите за изграждане са такива и ще отидем там в тази поредица. Но всъщност инструментът за изграждане е просто нещо, което ще улесни процеса ви. Автоматизирайте нещо, което преди сте правили на ръка.

В този смисъл IcoMoon е инструмент за изграждане. Това беше (е) популярен инструмент за изграждане на персонализирани шрифтове на икони. Прекрасно е за това. Поддържам всеки инструмент, който насърчава разработчиците от предния край да създават персонализирани, рационализирани активи само за това, от което се нуждаят, вместо да включва кухненската мивка (всяка икона на земята) и просто да използва битове от нея. IcoMoon не е само за шрифтове с икони @ font-face, но може да извежда SVG defs блокове, които нарича SVG спрайт (също напълно приемлив термин).

По принцип кликвате върху иконите, които искате, след което го експортирате и получавате перфектен SVG defs блок, който да използвате. Имайте предвид, че те все още не използват и аз не съм сигурен защо, но това означава, че ще трябва да включвате viewBoxнеща и достъпност сами, докато ги прилагате. Регистрирайте се за акаунт там и можете да запазите проекта, което означава, че можете да се върнете и да премахнете / добавите неща, както е необходимо, вместо да започнете от нулата. Това наистина го прави инструмент за изграждане.

Важно е да знаете за IcoMoon: можете да добавите свой собствен SVG. Вие не сте ограничени до това, което виждате в приложението по подразбиране. Можете да вземете SVG от друго място и просто да го добавите там и той ще спести с вашия проект. Можете да използвате IcoMoon като инструмент за изграждане само със свой собствен SVG и той все още ще бъде полезен.