The configuration is done in Webpack through the use of a configuration file, usually webpack.config.js, except in special circumstances where there can be more than one—or another—file assigned to this task. In the case of webpack.config.js, it is a JavaScript file that should be amended to alter the configuration settings of any particular project.

On startup, Webpack and Webpack 5 do not require a configuration file, but the software does recognize src/index as the default project input. It will also output the results of the build to a location named dist/main.js. This output will be "minified" and optimized for production.

Typically, however, a Webpack project will need to have its default configuration changed. The default configuration is how Webpack works without any loaders or special parameters assigned to it, such as described in Chapter 1, Introduction to Webpack 5, in the How Webpack works subsection. This is done through the use of the configuration file. The developer should create a file named webpack.config.js and place this in the root folder of the project. This file will be automatically detected and read by Webpack.

Let's begin our discussion by exploring the use of multiple configuration files.