[pull] main from webpack:main

README.md

@@ -318,6 +318,11 @@ If you are twitter savvy you can tweet #webpack with your question and someone s
 
 If you have discovered a 🐜 or have a feature suggestion, feel free to create an issue on GitHub.
 
+### Understanding webpack in a better way
+
+- [Understanding Webpack - Video 1](https://www.youtube.com/watch?v=xj93pvQIsRo)
+- [Understanding Webpack - Video 2](https://www.youtube.com/watch?v=4tQiJaFzuJ8)
+
 ### License
 
 [![FOSSA Status](https://app.fossa.io/api/projects/git%2Bhttps%3A%2F%2Fgithub.com%2Fwebpack%2Fwebpack.svg?type=large)](https://app.fossa.io/projects/git%2Bhttps%3A%2F%2Fgithub.com%2Fwebpack%2Fwebpack?ref=badge_large)

lib/optimize/SplitChunksPlugin.js

@@ -1743,6 +1743,9 @@ module.exports = class SplitChunksPlugin {
 								);
 								chunk.split(newPart);
 								newPart.chunkReason = chunk.chunkReason;
+								if (chunk.filenameTemplate) {
+									newPart.filenameTemplate = chunk.filenameTemplate;
+								}
 								// Add all modules to the new chunk
 								for (const module of group.items) {
 									if (!module.chunkCondition(newPart, compilation)) {

lib/stats/DefaultStatsFactoryPlugin.js

@@ -1852,7 +1852,7 @@ const spaceLimited = (
 						// So it should always end up being smaller
 						const headerSize = group.filteredChildren ? 2 : 1;
 						const limited = spaceLimited(
-							/** @type {Children<T>} */ (group.children),
+							/** @type {Children<T>[]} */ (group.children),
 							maxGroupSize -
 								// we should use ceil to always feet in max
 								Math.ceil(oversize / groups.length) -

test/__snapshots__/StatsTestCases.basictest.js.snap

@@ -4061,6 +4061,20 @@ chunk (runtime: main) main.js (main) X bytes (javascript) X KiB (runtime) >{asyn
 production (webpack x.x.x) compiled successfully"
 `;
 
+exports[`StatsTestCases should print correct stats for split-chunks-cache-group-filename 1`] = `
+"Entrypoint main X KiB = 587.vendors.js X bytes 414.vendors.js X bytes 605.vendors.js X bytes main.js X KiB
+chunk (runtime: main) 414.vendors.js (id hint: vendors) X bytes [initial] [rendered] split chunk (cache group: vendors)
+  ./node_modules/b.js X bytes [built] [code generated]
+chunk (runtime: main) 587.vendors.js (id hint: vendors) X bytes [initial] [rendered] split chunk (cache group: vendors)
+  ./node_modules/a.js X bytes [built] [code generated]
+chunk (runtime: main) 605.vendors.js (id hint: vendors) X bytes [initial] [rendered] split chunk (cache group: vendors)
+  ./node_modules/c.js X bytes [built] [code generated]
+chunk (runtime: main) main.js (main) X bytes (javascript) X KiB (runtime) [entry] [rendered]
+  runtime modules X KiB 4 modules
+  ./index.js X bytes [built] [code generated]
+webpack x.x.x compiled successfully in X ms"
+`;
+
 exports[`StatsTestCases should print correct stats for split-chunks-chunk-name 1`] = `
 "Entrypoint main X KiB = default/main.js
 chunk (runtime: main) default/async-b.js (async-b) (id hint: vendors) X bytes <{792}> [rendered] reused as split chunk (cache group: defaultVendors)

test/statsCases/split-chunks-cache-group-filename/index.js

@@ -0,0 +1,5 @@
+import a from "a";
+import b from "b";
+import c from "c";
+
+console.log(a, b, c);

test/statsCases/split-chunks-cache-group-filename/webpack.config.js

@@ -0,0 +1,25 @@
+/** @type {import("../../../types").Configuration} */
+module.exports = {
+	mode: "production",
+	entry: {
+		main: "./"
+	},
+	optimization: {
+		splitChunks: {
+			cacheGroups: {
+				default: false,
+				vendors: {
+					chunks: "initial",
+					filename: "[name].vendors.js",
+					minSize: 1,
+					maxInitialSize: 1,
+					test: /[\\/]node_modules[\\/]/
+				}
+			}
+		}
+	},
+	stats: {
+		assets: false,
+		chunks: true
+	}
+};