Какие проблемы Frontend решает сборщик кроме склеивания файлов в один?

Продвинутые темы

Кроме склеивания файлов, сборщик решает: транспиляцию (Babel/TS), обработку не-JS ресурсов (CSS, изображения), минификацию, tree shaking, code splitting, dev-сервер с HMR, оптимизацию и подстановку env.

Проблемы, которые решает сборщик

Транспиляция

Современный JS/JSX/TS → совместимый код для браузеров (через Babel/esbuild):

// стрелки, async/await, JSX, TS → ES5/совместимый

Обработка не-JS ресурсов

Импорт CSS, изображений, шрифтов, SVG как модулей (loaders):

import styles from './app.css';
import logo from './logo.png';

Минификация

Уменьшение размера (пробелы, имена, мёртвый код) — быстрее загрузка.

Tree shaking

Удаление неиспользуемого кода из бандла — меньше размер.

Code splitting

Разбиение на чанки, ленивая загрузка по маршрутам/компонентам — быстрый первый показ.

Dev-сервер и HMR

Быстрая разработка: мгновенное обновление модулей без перезагрузки, с сохранением состояния.

Оптимизация ресурсов

Сжатие изображений, инлайн мелких ресурсов, хеши в именах (кеширование).

Env-переменные

Подстановка переменных окружения (dev/prod).

Разрешение модулей

Обработка import, алиасы путей, node_modules.

Source maps

Отладка исходников вместо минифицированного кода.

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

Кроме склеивания, сборщик решает: транспиляцию (Babel/TS, JSX), обработку не-JS ресурсов (CSS, изображения через loaders), минификацию, tree shaking (удаление мёртвого кода), code splitting (ленивая загрузка), dev-сервер с HMR, оптимизацию ресурсов (хеши, сжатие), подстановку env-переменных, source maps. Это полноценная система сборки, которая умеет больше конкатенации.