Tailwind v4 после обновления, конфиг в css вместо js это шаг назад

[rojo7509]

Перешел на Tailwind v4 и не могу решить нравится мне или нет, главное изменение в том что конфиг переехал из tailwind.config.js в css через @theme, и это поломало мой привычный воркфлоу. Новый движок на Rust (Oxide) реально быстрее, пересборка стилей почти мгновенная, это плюс безоговорочный. Но конфигурация через css-переменные вместо js-объекта меня смущает: раньше я мог генерить цвета и спейсинги из js, тянуть токены из дизайн-системы программно, а теперь все в @theme и динамику накручивать неудобно. Плюс отвалилась часть плагинов которые еще не обновились под v4. У кого реальный проект переехал, оно того стоило или вы откатились.

[sleepypanic]

@rojo7509, откатываться куда, на v3 которая больше не развивается. вперед только. да, болит, но через полгода забудешь что был js конфиг

[Vvz1995]

у меня плагин для типографики неделю не обновляли под v4 и я просто скопировал нужные классы руками. мелочь а бесит

[raspberry_pilot]

тянуть токены из дизайн-системы программно, а теперь все в @theme и динамику накручивать неудобно

ты css-переменные недооцениваешь. как раз токены из дизайн-системы прекрасно ложатся в css custom properties, это даже честнее чем гонять их через js на этапе сборки. у нас фигма-токены экспортятся прямо в :root и @theme их подхватывает, никакого js билд-степа. ты просто привык к старому способу

[postgres_andy]

честно за 10 лет в фронте я перестал понимать зачем мне тейлвинд вообще. обычный css с вложенностью которая теперь нативна в браузерах делает 90% того же без 300 классов в одном диве

[aqwzsx]

@sleepypanic, По миграции конкретно, прошли с командой на прошлой неделе, проект средний, около 200 компонентов на Vue 3. Что реально нужно знать перед обновлением:
Первое, прогони официальный апгрейд-скрипт npx @tailwindcss/upgrade, он перетащит большую часть конфига из js в css автоматически и поправит переименованные классы (shadow-sm стал shadow-xs и подобное, ломающих переименований десятка два). Глазами потом все равно проверяй.
Второе, подключение поменялось, вместо трех директив @tailwind теперь один @import tailwindcss, и postcss-плагин вынесен в отдельный пакет @tailwindcss/postcss. Если используешь Vite, ставь @tailwindcss/vite, он быстрее.
Третье, про твою боль с динамикой. @theme это не тупик. Статические токены держишь в @theme, а то что реально должно меняться в рантайме (темы, брендинг под клиента) кидаешь в обычные css-переменные и ссылаешься на них. Получается даже гибче чем было, потому что переключение темы теперь без пересборки.
Четвертое, проверь браузерную поддержку, v4 требует свежих браузеров (Safari 16.4+, цветовые функции и каскадные слои). Если у тебя в аудитории много старых вебвью или корпоративный ишак, это стоп-фактор, проверяй метрику до миграции.
По итогу окупилось скоростью сборки и нативными css-фичами, но если проект маленький и v3 работает, спешить незачем.

[Planed]

v4 требует свежих браузеров (Safari 16.4+

вот это реально засада которую все пропускают пока не прилетит баг с продакшена. у меня в b2b проекте до сих пор 4% сафари 15 и младше, для них верстка поехала. пришлось городить фолбэки, лучше бы и не обновлялся

[archmaster]

ну такое. поменяли местами и назвали революцией. css-движок быстрый да, остальное вкусовщина