Webpack多个文件条目包

Question

Will webpack produce different results given a configuration like so:

// webpack.config.js
module.exports = {
    ...
    entry: {
        main: ['./index.js'],
    }
}


// index.js
import 'babel-polyfill'
...

vs.

// webpack.config.js
module.exports = {
    ...
    entry: {
        main: ['babel-polyfill', './index.js'],
    }
}


// index.js
// babel-polyfill import removed
...

Which one is preferred, and why?

Answer 1

Both works kind of the same way. The option 1, webpack would treat babel-polyfill as a dependency, in the dependency tree.

The second one, webpack would treat babel-polyfill as an entrypoint, where it would try to generate a dependency graph from that, which would have 0 dependencies.

There is no real difference here, nor any impact on the result bundle, both will contain babel-polyfill anyways, and also there is no "preferred" way to add that, babel itself refeers to both ways on their guide.

Answer 2

The result will be the same. It depends on you, usually I prefer to import the dependencies in modules rather than importing implicitly in webpack config.