Webpack CLI — 15 основных команд

Webpack CLI предоставляет набор команд для работы с Webpack.

Вот список самых популярных команд:

1. webpack — Запускает сборку проекта. Если конфигурационный файл webpack имеет стандартное имя (webpack.config.js), то достаточно запустить команду webpack без дополнительных параметров.

2. webpack —config <путь/к/файлу> Запускает сборку проекта, используя конфигурационный файл, расположенный по указанному пути.

webpack --config custom.config.js

3. webpack —mode <development|production> — Запускает сборку проекта в определенном режиме. Возможные значения: development (режим разработки) и production (режим продакшна).

webpack --mode development

4. webpack —watch — Запускает сборку проекта и следит за изменениями файлов, автоматически пересобирая проект при обнаружении изменений.

5. webpack serve — Запускает webpack-dev-server для разработки в режиме реального времени с автоматической перезагрузкой страницы при изменении исходных файлов.

6. webpack —entry <путь/к/файлу> — Запускает сборку с указанным файлом в качестве точки входа.

webpack --entry src/index.js

7. webpack —output <путь/к/директории> — Запускает сборку с указанной директорией для вывода собранного бандла.

webpack --output dist

8. webpack —help — Выводит список доступных команд и опций

9. webpack —version — Выводит версию Webpack и Webpack CLI, установленных в вашем проекте.

10. webpack —progress — Отображает прогресс сборки в процентах во время выполнения команды webpack.

11. webpack —profile — Записывает профилировочную информацию о времени выполнения каждого шага в процессе сборки, которую затем можно анализировать для оптимизации процесса.

12. webpack —analyze — Анализирует размеры модулей и зависимостей в вашем бандле с использованием веб-пакета webpack-bundle-analyzer. При использовании этой команды убедитесь, что установили пакет webpack-bundle-analyzer:

npm install --save-dev webpack-bundle-analyzer

13. webpack —env <переменная_среды> — Позволяет передать переменные среды в ваш конфигурационный файл webpack.

webpack --env production

14. webpack —display <опция> — Контролирует информацию, отображаемую в консоли после завершения сборки. Возможные значения: minimal, none, errors-only, normal и verbose.

15. webpack —json — Выводит результат сборки в формате JSON.

Читайте также: Настраиваем Webpack с нуля для css и js. Два варианта