Building Enterprise JavaScript Applications

Entry/output

As mentioned already, Webpack is a module bundler. It takes your application code, and all its dependencies, and bundles them into one or a small number of files. These files can then be transferred to the client and executed. More formally, it takes many source input files and bundles them into output file(s). With Webpack, the developer specifies one or several entry points, and Webpack will follow require or import statements in each file to build up a tree of dependencies.

Webpack's original selling point is its configurability. So let's begin by creating a configuration file at webpack.config.js.

const webpack = require('webpack');module.exports = {  entry: {    app: './src/index.jsx',  },  output: { filename: './dist/bundle.js', ...