CODEWITHSUNDEEP
webpackwebpack-4webpack-splitchunks
Emanuele Ciriachi
Emanuele Ciriachi

Reputation: 2274

Webpack: emitted chunks do not create a main entrypoint

I upgraded webpack from version 2 to version 4. My config includes:

entry = {
    Main: './main',
    App: './app'
};

and

var output = {
    path: path.join(__dirname, outPath, '_js'),
    publicPath: '/_js/',
    filename: '[name]-bundle.js'
};

In version 2, my output was simply App-bundle.js and Main-bundle.js, but in webpack@4 the output is

Entrypoints:
  Main (414 KiB)
      Main~493df0b3-bundle.js
      Main~4c0201b9-bundle.js
  App (316 KiB)
      App~47dad47d-bundle.js
      App~6bd0612f-bundle.js
      App~01e7b97c-bundle.js

without a central, non-hashed file name to import.

EDIT:

My optimization object looks like this:

optimization: {
    splitChunks: {
        chunks: 'async',
        minSize: 20000,
        maxSize: env === 'production' ? 1000000 : 0,
        minChunks: 1,
        maxAsyncRequests: 6,
        maxInitialRequests: 4,
        automaticNameDelimiter: '~',
        cacheGroups: {
          default: {
            minChunks: 1,
            priority: -20,
            reuseExistingChunk: true
          }
        }
    },
    minimize: env === 'production' ? true : false
},

--- QUESTION ---

I'm ok having chunks, but how do I configure webpack 4 in order to have a central entry file called simply Main-bundle.js and App-bundle.js that I can easily import in my HTML templates?

Upvotes: 0

Views: 1044

Answers (1)

Raz Ronen
Raz Ronen

Reputation: 2638

Please delete minSize and maxSize in your splitChunks configurations. Or alternatively, lower the minSize and uprise maxSize.

minSize and maxSize are quite handy when you want to fine-tune your chunks for performance, or other reasons that consider chunk size.

Personally I found out that having 600KB size chunks for 10 chunks that are downloaded as 'inital chunks' are the best fine-tune performance in my application. I couldn't reach the same perf results without it, as webpack created an uneven and big chunks for some of my entry points.

Upvotes: 1

Related Questions