Зачем нужен сборщик?

Сборщик (bundler) нужен, чтобы объединить множество исходных модулей и ресурсов в оптимизированные файлы для браузера, разрешить зависимости и применить преобразования.

Зачем нужен

• Объединение модулей — браузеру неудобно грузить сотни файлов; сборщик собирает граф зависимостей в несколько бандлов.
• Преобразование кода — транспиляция (Babel/TS), обработка JSX, CSS-модулей, импорт изображений.
• Оптимизация — минификация, tree shaking (удаление неиспользуемого), code splitting.
• Dev-инструменты — dev-сервер, Hot Module Replacement, source maps.

src/*.js, *.css, *.png → [Bundler] → dist/bundle.js, bundle.css

Основные возможности

• Code splitting — разбить бандл, грузить по маршрутам.
• Tree shaking — убрать мёртвый код.
• Loaders/plugins — обработка разных типов файлов.
• Asset handling — импорт стилей, шрифтов, картинок.

Инструменты

• Webpack — мощный, гибкий, много конфигурации.
• Vite — быстрый (с Vite 8 — Rolldown, раньше esbuild/Rollup), популярный для dev.
• Rollup — для библиотек.
• esbuild, Parcel — быстрые/zero-config.

Коротко для собеседования

Сборщик (Webpack, Vite) объединяет модули и ресурсы в оптимизированные бандлы: разрешает зависимости, транспилирует, минифицирует, делает tree shaking и code splitting, даёт dev-сервер с HMR. Нужен, чтобы современный модульный код эффективно работал в браузере.