Комментарии 13
vite или esbuild
А Vite может работать только для CSS файлов?
Попробую объяснить проблему: есть проект, который состоит только из SCSS файлов (то есть там не нужны js файлы совсем). Нужен сборщик который объеденит их в один и минифицирует. На данном этапе с этим отлично справляется WebPack, но есть небольшое но. Ему для работы нужен хотя бы один js файл, как точка входа можно сказать. Хоть его цель и заключается только в обработке css, ему все равно нужен этот js файл (на данный момент он просто пустой), и в итоговой сборке это тоже пустой js файл. И получается настроен плагин что после сборки он просто удаляет ненужный js файл. Может ли Vite работать только с CSS?
"Легковесность" в идеале замеры одного и того же кода в Кб, чтобы понять разницу.
"Быстрая Сборка" даже на старых системниках не замечал проблем со скоростью сборки.
"без необходимости перезагрузки всего приложения" точно такого нет в webpack? Вот прям точно?
"Простая Настройка" а как там с bable?
В целом, после поста захотелось проверить Vite на практике. Но, пока, выгода от перехода не совсем очевидна.
Легковесность - тут скорее про тулчейн, чем про выходной файл
Быстрая Сборка - проекты на вебпаке прямо ощутимо дольше собираются чем на vite. Особенно если хорошая работа над разбиением на чанки была произведена
Простая Настройка - бабель там не используется. Вместо него esbuild, что и дает заметный выигрыш по скорости
Недавно тоже довелось поработать с vite. Для меня пока сырым и неоднозначным остался данный сборщик.
Из плюсов я увидел:
более быструю работу в режиме разработки за счёт использования esm модулей, что избавляет сборщик от их сборки во время разработки так как это делает webpack.
Нулевая конфигурация. Если тебе нужно условное приложение на реакте с клиентским рендерингом - можно быстро развернуть готовый шаблон.
Относительно широкий спектр плагинов.
Из минусов лично для меня выделил следующие:
Не такая широкая экосистема плагинов как у вебпака. Встречалось такое, что попросту невозможно было найти какое-то решение, которое хотя бы подтолкнуло к решению проблемы.
Не большое комьюнити на текущий момент. По вебпаку множество сообществ, ответов, статей и ТД. Vite пока не успел обрасти таким количеством
Нет проверенных, официальных шаблонов по некоторым часто выполняемым задачам. Например, SSR. Да, в документации есть какие-то шаблоны, но насколько они покрывают частые случаи - загадка.
Продакшн сборка происходит всё таким старым способом в виде бандла с помощью rollup.
Из минусов лично для меня выделил следующие:
Дополню. Разработчик там один китаец, которого может збить автобус. И насколько помню - он основной разработчик vue.. соответственно приоритет при решении проблем будет отдавать больше vue чем реакту, чтобы продвигать свою библиотеку.
Давайте все по пунктам разберем.
Сравнение с экосистемой вебпака. Да сейчас экосистема вебпака больше, но это будет оч быстро меняться. Уже все современные фреймворки и продукты уходят от поддержки первого уровня webpack-а на поддержку в первую очередь vite (Angular тоже уже заявил о переходе на vite. только с React вопросы ибо им все равно)
Официальное решение по SSR это vike
rollup - ну и чем это плохо? тем более на последней конференции объявили что уже в разработке Rolldown (Rollup на Rust)
В комменте про китайца и автобус. Ну глупости то зачем говорить? Он создатель, но далеко не единственный разработчик. Для опровержения бас-фактора можно посмотреть, что сейчас он уже оч мало своего вносит https://github.com/vitejs/vite/graphs/contributors
В дополнение к статье, с fortawesome, я всё таки справилась, без танцев с бубном, просто нужно было вместо fortawesome, установить fortawesome-free : )
viject позволяет легко перейти с react-scripts на vite. Буквально в две консольные команды.
Миграция с Webpack и react-scripts на Vite: Путь к Быстрому и Легковесному React