I am trying to use splitChunks in Webpack 4, expecting to bundle the modules in node_modules into one bundle that won't be re-compiled each time I make a change to my code.
I added this code in my webpack.config.js:
optimization: {
splitChunks: {
chunks: 'all'
}
},
And I added this line in my index.html:
<script src="./vendors~app.js"></script>
The file 'vendor~app.js' being the new bundle generated.
When I run the webpack-dev-server the first time, it says:
Built at: 2018-09-13 13:32:47
Asset Size Chunks Chunk Names
app.js 3.15 KiB 0 [emitted] app
vendors~app.js 1.91 MiB 1 [emitted] [big] vendors~app
app.js.map 13.7 KiB 0 [emitted] app
vendors~app.js.map 3.98 MiB 1 [emitted] vendors~app
When I make a change to my source code and save, the webpack-dev-server starts compiling as expected and says:
Built at: 2018-09-13 13:33:46
Asset Size Chunks Chunk Names
app.js 3.16 KiB 0 [emitted] app
vendors~app.js 1.91 MiB 1 [emitted] [big] vendors~app
app.js.map 13.7 KiB 0 [emitted] app
vendors~app.js.map 3.98 MiB 1 [emitted] vendors~app
I was expecting the compiler not to re-compile vendors~app.js! I thought that was the point of using splitChunks? Am I wrong? how can I avoid the compiler to re-compile vendors~app.js?
Thank you very much.