What does it mean when the webpack entry property is given an object with arrays of strings as values?

Question

The Webpack documentation allows for the possibility of an object with arrays of strings for values being passed to the entry property of Webpack config.

e.g.

Usage: entry: {[entryChunkName: string]: string|Array<string>}

However the documentation does not discuss what this actually means. Is this the equivalent of multiple entry points? Does this cause any different behaviour?

Here is an example of it being used in a project serverless/aws-nodejs-typescript.

Answer 1

An entry point can be defined in 3 ways:

1)

entry: {
 main: './src/index.js',
 dashboard: './dashboard/dashboard.js'
}

This creates a file for every single property in the object.

2)

entry: './src/index.js'

The usual configuration, not much different.

3)

entry: ['@babel/polyfill', 'src/index.js', 'otherfile', 'other something']

The only difference between defining as an object and defining as an array is that as an object webpack creates more than one "main" bundle file, it is also a code splitting strategy.

When defining as an array, webpack will look for dependencies in all these files and put them into the same "entry" file, basically it is categorized as 1 single file.

What is happening with that project you linked is a combination of 1 + 3, which we could say it is a "4". That creates an object for each entry and each entry on that object is composed by an array of different other libraries.