В чем разница между сборщиками

«В чем разница между сборщиками» — вопрос из категории Devops, который задают на 10% собеседований Frontend Разработчик. Ниже — развёрнутый ответ с разбором ключевых моментов.

Ответ

Сборщики (например, Webpack, Rollup, Parcel, Vite) различаются подходом к сборке, производительностью и конфигурацией.

Webpack — мощный, гибкий, но сложный в настройке. Использует плагины и лоадеры для обработки файлов. Подходит для больших проектов.

Rollup — оптимизирован для библиотек, создает более чистый бандл за счет tree-shaking. Конфигурация проще, чем у Webpack.

Parcel — zero-config, работает из коробки. Автоматически обрабатывает зависимости, но менее гибкий.

Vite — современный, использует нативный ESM в dev-режиме для мгновенной перезагрузки. Быстрый, но требует поддержки ES-модулей в браузере.

Пример конфига Vite:

// vite.config.js
export default {
  build: {
    outDir: 'dist',
  },
  plugins: [vue()]
}