Чтобы установить Webpack, вам необходимо выполнить следующие действия:
-
Убедитесь, что на вашем компьютере установлен Node.js. Webpack построен на Node.js, поэтому он понадобится вам для запуска Webpack.
-
Откройте терминал или командную строку и перейдите в каталог проекта.
-
Выполните следующую команду, чтобы инициализировать новый проект Node.js и создать файл
package.json
(если у вас его еще нет):npm init -y
Эта команда устанавливает новый проект Node.js с настройками по умолчанию.
-
Затем установите Webpack и его интерфейс командной строки (CLI) в качестве зависимостей для разработчиков, выполнив следующую команду:
npm install webpack webpack-cli --save-dev
Эта команда устанавливает Webpack локально в вашем проекте и сохраняет его как зависимость разработки в файле
package.json
. -
После завершения установки создайте файл конфигурации с именем
webpack.config.js
в корне каталога вашего проекта. Этот файл будет содержать параметры конфигурации вашей сборки Webpack.Вот простой пример файла
webpack.config.js
:const path = require('path'); module.exports = { entry: './src/index.js', output: { path: path.resolve(__dirname, 'dist'), filename: 'bundle.js', }, };
В этом примере мы указываем точку входа нашего приложения (
./src/index.js
), а также выходной каталог и имя файла для встроенного JavaScript (dist/bundle.js).
). -
Наконец, вы можете запустить Webpack для сборки проекта, выполнив следующую команду:
npx webpack
Команда
npx webpack
объединит ваше приложение на основе конфигурации, указанной вwebpack.config.js
, и сгенерирует выходные файлы в указанном выходном каталоге.
Вот и все! Вы успешно установили Webpack и настроили его для создания проекта.