Pull to refresh

Comments 2

Мой вариант "автоматизации" иконок:

1. Создал папку /icons

2. Внутрь кладу свг-файлики иконок и index.js со списком экспортов типа
export { ReactComponent as IconCross } from "./cross.svg";

3. Делаю новую фичу. Вижу иконку в макете, если новая - процесс такой:
- ручной экспорт из фигмы,
- далее руками вставляю в онлайн-svgo, убираю лишние дефолтные цвета заливок и\или обводок
- копирую результат и добавляю новую иконку в папку /icons

Всё!

Пункт 3 не очень сложный и активный только на старте проекта, потом предельно редко выполняется, т.к. все нужные иконки уже "в базе" проекта. Также эта ручная корректировка даёт полный контроль над результатом.
Если человек на проекте новый и видит "непоняную" иконку в макете - зашёл в папкку /icons - проклацал быстренько - редактор показал превью иконки - и уже понимает есть ли такая иконка в проекте или нет.
В любом случае, через небольшое время, любой разработчик уже "насмотрен" и очень быстро понимает новая ли это иконка, или уже есть "в базе" проекта. No big deal.

Зачем автоматизация при загрузке иконок

Для меня непонятно зачем. Возня с переносом иконок из макетов в проект редкая, и каждый раз "особенная". Подымать целый сервис под это, обслуживать его и т.д. ради того что нужно только на старте проекта - нерентабельно. Любой написанный код - это пассив. По идее, автоматизировать нужно то, что нужно на протяжении всей жизни проекта.

Ещё удобнее было бы иметь под рукой витрину всех наших иконок, на которой мы увидеть их все вместе как на ладони.

Чем макет с иконками в фигме - не витрина? зачем дублировать?

который управляется единственным источником правды – макетами дизайнеров

так себе источник истины. Дизайны приходящие\уходящие, постоянно что-то редизайнят и т.д. Доверять можно только своему коду. Макеты - это не истина, это стартовая точка отсчёта, т.е. один из аспектов который желательно бы учитывать. Истину диктует - текущий срез состояния проекта в коде.

Есть ли у вас идеи по организации использованных иконок в спрайт автоматом?

Sign up to leave a comment.