Базовая установка webpack

Admin Webpack

Устанавливаем webpack на Mac OS. В этой заметке только установка вебпака, без его настройки.

Как устанавливать вебпак на Symfony можно узнать внутри заметки о Symfony. Здесь же будет описан способ установки вебпака вне этого фреймворка.

Прежде всего должен быть установлен Node.js и установщик пакетов npm.

Устанавливаем Webpack

Переходим в директорию, где хотим чтобы находился webpack. Здесь внутри папки webpack запускаем:

npm init

Будет создан типовой конфигурационный файл package.json

Устанавливаем вебпак

npm install --save-dev webpack

После этого в package.json в devDependency пропишется webpack. Также появится папка node_modules внутри которой будут модули вебпак.

Установим CLI для вебпака

npm install --save-dev webpack-cli

Установка дополнительных модулей

Примеры установки модулей compass и обработчиков sass

npm install --save-dev sass-loader
npm install --save-dev css-loader
npm install --save-dev compass

Исправляем ошибки

На Mac OS Catalina может появится ошибка:

gyp: No Xcode or CLT version detected!
gyp ERR! configure error
gyp ERR! stack Error: `gyp` failed with exit code: 1
gyp ERR! stack at ChildProcess.onCpExit (/usr/local/lib/node_modules/npm/node_modules/node-gyp/lib/configure.js:345:16)
gyp ERR! stack at ChildProcess.emit (events.js:198:13)
gyp ERR! stack at Process.ChildProcess._handle.onexit (internal/child_process.js:248:12)
gyp ERR! System Darwin 19.2.0
gyp ERR! command «/usr/local/bin/node» «/usr/local/lib/node_modules/npm/node_modules/node-gyp/bin/node-gyp.js» «rebuild»
gyp ERR! cwd /node_modules/fsevents
gyp ERR! node -v v10.16.3
gyp ERR! node-gyp -v v3.8.0
gyp ERR! not ok
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.11 (node_modules/fsevents):
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.11 install: `node-gyp rebuild`
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: Exit status 1

Для исправления удалим xcode и заново устанавливаем.

Внимание! Xcode будет скачиваться заново. В зависимости от скорости интернета на это может уйти от 5 и больше минут.

Команды по переустановки xcode на Mac OS

sudo rm -rf $(xcode-select -print-path)
xcode-select --install

Дополнительно можно (не обязательно) установить node-gyp:

/usr/sbin/pkgutil --packages | grep CL
sudo npm install -g node-gyp

Теперь заново устанавливаем вебпак:

npm install --save-dev webpack

Если все прошло без проблем, то на этом вебпак установлен. Но для того чтобы он работал надо его еще настроить. А как это сделать — поиск в google поможет.

Метки:

У сайта нет цели самоокупаться, поэтому на сайте нет рекламы. Но если вам пригодилась информация, можете лайкнуть страницу, оставить комментарий или отправить мне подарок на чашечку кофе.

Добавить комментарий

Напишите свой комментарий, если вам есть что добавить/поправить/спросить по теме текущей статьи:
"Базовая установка webpack"