Плагин SVG to Vue.js component экспортирует выбранные фреймы в файлы .vue с общими реквизитами.
Лучше всего подходит для иконок, логотипов и иллюстраций.
Как использовать:
- Выбрать фреймы;
- Запустить плагин;
- Настроить параметры экспорта;
- Нажмите «Download»;
- Скопируйте файлы в свой проект;
- Используйте в своем проекте «FrameName size=»24px» style=»color: black» /». ;
Компонент реквизита:
- Размер: необязательная строка;
- Ширина: необязательная строка;
- Высота: необязательная строка.
- «FrameIcon size=»24px» /»
- «FrameIcon width=»24px» /»
- «FrameIcon height=»24px» /«
Параметры экспорта
«.fill-current-color» вместо заливки в оттенках серого
«.stroke-current-color» вместо обводки в градациях серого
Удаляет заливку/обводку в оттенках серого и добавляет класс узлу. Работает только в том случае, если все заливки/обводки во фрейме выполнены в оттенках серого (если фрейм имеет насыщенный цвет заливки/обводки, весь фрейм будет проигнорирован). Лучше всего для иконок. Не забудьте добавить правила css:.fill-current-color { fill: currentColor }
.stroke-current-color { stroke: currentColor }
Удалить маски
Удаляет все узлы «mask»
Удалить фрейм clipPath
Устанавливает overflow=»visible» и удаляет clip-path. Полезно, когда вы хотите сохранить размер фрейма, но есть элементы, выходящие за его границы. Например элементы с тенью.