Babel Applications with Webpack

Webpack is an application bundler for JavaScript applications that provides a much more configurable experience. In version 4, the webpack team introduced zero-configuration support in order to compete with Parcel specifically. While webpack is an excellent tool for bundling your JavaScript and other assets, it does take quite a lot of configuring and requires just as much patience.

To use a webpack, you simply install it, just like any JavaScript module. Webpack comes in two main parts: the webpack engine and the webpack CLI. Both can be installed simultaneously, like so:

npm install --save-dev webpack webpack-cli

If you install it using your Terminal, you should see the following output:

Figure 12.12: Webpack installation

With those downloaded, you can then add a script in the package.json file in order to execute them, like so:

"wp": "webpack"

Then, by running the script in the Terminal,...