Webpack

Описание

Webpack — это статический модульный сборщик для приложений на JavaScript.

Особенности Webpack

• Webpack позволяет избавиться от bower и gulp/grunt в приложении, и заменить их одним инструментом. Вместо bower’а для установки и управления клиентскими зависимостями, можно использовать стандартный Node Package Manager (npm) для установки и управления всеми фронтэнд-зависимостями.
• Вебпак также может выполнять большинство задач grunt/gulp’а.
• Webpack не ограничивается одним лишь фронтендом, его также успешно применяют в бэкенд разработке на Node.js.
• Webpack — это более целенаправленный инструмент. Вам достаточно указать точку входа в ваше приложение (это может быть даже HTML-файл с тегами <script>), а webpack проанализирует файлы и объединит их в один выходной JavaScript-файл, содержащий все необходимое для запуска приложения.
• Webpack может быть установлен глобально или локально для каждого проекта.

Возможности Webpack

• Помогает собрать воедино ваши ресурсы.
• Следит за изменениями и повторно выполняет задачи.
• Может выполнить транспиляцию JavaScript следующего поколения до более старого стандарта JavaScript (ES5) с помощью Babel, что позволит использовать новейшие функции JavaScript, не беспокоясь о том, поддерживает их браузер или нет.
• Может выполнить транспиляцию CoffeeScript в JavaScript.
• Может конвертировать встроенные изображения в data:URI.
• Позволяет использовать require() для CSS файлов.
• Может запустить webpack-dev-server (в нём встроен локальный сервер и livereload (“живая перезагрузка браузера”)).
• Может работать с Hot Module Replacement (замена горячего модуля).
• Может разделить выходной файл (output file) на несколько файлов, чтобы избежать медленной загрузки страницы из-за большого размера JS-файла.
• Может выполнить Tree Shaking.