Basic webpack installation

Install webpack on Mac OS. In this note, only installing the webpack, without configuring it.

You can learn how to install a webpack on Symfony inside the Symfony note. It will also describe how to install a webpack outside of this framework.

First of all, Node.js and the npm package installer must be installed.

Install Webpack

We go to the directory where we want webpack to be. Here inside the webpack folder, run:

A typical configuration file will be created. package.json

Install the webpack

npm install –save-dev webpack

After that, webpack is written in package.json in devDependency. A folder will also appear. node_modules inside which there will be webpack modules.

Install CLI for webpack

npm install –save-dev webpack-cli

Installation of additional modules

Examples of installing compass modules and sass handlers

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

Bug fixes

On Mac OS Catalina, an error may appear:

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{45: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 /Users/Dream/Sites/
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`

To fix it, remove xcode and reinstall.

Attention! Xcode will download again. Depending on the speed of the Internet, this can take from 5 or more minutes.

Xcode reinstallation commands on mac os

sudo rm -rf $ (xcode-select -print-path)
xcode-select –install
/ usr / sbin / pkgutil –packages | grep CL
sudo npm install -g node-gyp

Now reinstall the webpack:

npm install –save-dev webpack

If everything went without problems, then this webpack is installed. But in order for it to work, you still need to configure it. And how to do it – a google search will help.

Similar Posts

Leave a Reply

Your email address will not be published. Required fields are marked *