compute chunk roots correctly when using transitive connections

also use module.nameForCondition() to compute module ids fixes webpack-contrib/mini-css-extract-plugin#676
webpack · Jan 11, 2021 · 916bf69 · 916bf69
1 parent a064b0f
commit 916bf69
Show file tree

Hide file tree

Showing 5 changed files with 51 additions and 9 deletions.
diff --git a/lib/ChunkGraph.js b/lib/ChunkGraph.js
@@ -6,6 +6,7 @@
 "use strict";
 
 const util = require("util");
+const ModuleGraphConnection = require("./ModuleGraphConnection");
 const SortableSet = require("./util/SortableSet");
 const {
 	compareModulesById,
@@ -272,10 +273,19 @@ class ChunkGraph {
 			findGraphRoots(set, module => {
 				/** @type {Set<Module>} */
 				const set = new Set();
-				for (const connection of moduleGraph.getOutgoingConnections(module)) {
-					if (!connection.module) continue;
-					set.add(connection.module);
-				}
+				const addDependencies = module => {
+					for (const connection of moduleGraph.getOutgoingConnections(module)) {
+						if (!connection.module) continue;
+						const activeState = connection.getActiveState(undefined);
+						if (activeState === false) continue;
+						if (activeState === ModuleGraphConnection.TRANSITIVE_ONLY) {
+							addDependencies(connection.module);
+							continue;
+						}
+						set.add(connection.module);
+					}
+				};
+				addDependencies(module);
 				return set;
 			})
 		).sort(compareModulesByIdentifier);

diff --git a/lib/ids/IdHelpers.js b/lib/ids/IdHelpers.js
@@ -77,9 +77,14 @@ const shortenLongString = (string, delimiter) => {
  * @returns {string} short module name
  */
 const getShortModuleName = (module, context, associatedObjectForCache) => {
-	return avoidNumber(
-		module.libIdent({ context, associatedObjectForCache }) || ""
-	);
+	const libIdent = module.libIdent({ context, associatedObjectForCache });
+	if (libIdent) return avoidNumber(libIdent);
+	const nameForCondition = module.nameForCondition();
+	if (nameForCondition)
+		return avoidNumber(
+			makePathsRelative(context, nameForCondition, associatedObjectForCache)
+		);
+	return "";
 };
 exports.getShortModuleName = getShortModuleName;
 

diff --git a/test/configCases/plugins/mini-css-extract-plugin/chunk.js b/test/configCases/plugins/mini-css-extract-plugin/chunk.js
@@ -1 +1,3 @@
 import "./chunk.css";
+
+export default 42;
diff --git a/test/configCases/plugins/mini-css-extract-plugin/webpack.config.js b/test/configCases/plugins/mini-css-extract-plugin/webpack.config.js
@@ -5,7 +5,8 @@ module.exports = {
 	entry: {
 		a: "./a",
 		b: "./b",
-		c: "./c.css"
+		c: "./c.css",
+		x: "./x" // also imports chunk but with different exports
 	},
 	output: {
 		filename: "[name].js"
@@ -18,9 +19,32 @@ module.exports = {
 			}
 		]
 	},
+	optimization: {
+		chunkIds: "named"
+	},
 	target: "web",
 	node: {
 		__dirname: false
 	},
-	plugins: [new MCEP()]
+	plugins: [
+		new MCEP(),
+		compiler => {
+			compiler.hooks.done.tap("Test", stats => {
+				const chunkIds = stats
+					.toJson({ all: false, chunks: true, ids: true })
+					.chunks.map(c => c.id)
+					.sort();
+				expect(chunkIds).toEqual([
+					"a",
+					"b",
+					"c",
+					"chunk_js-_43b60",
+					"chunk_js-_43b61",
+					"chunk_js-_43b62",
+					"d_css",
+					"x"
+				]);
+			});
+		}
+	]
 };
diff --git a/test/configCases/plugins/mini-css-extract-plugin/x.js b/test/configCases/plugins/mini-css-extract-plugin/x.js
@@ -0,0 +1 @@
+import(/* webpackExports: [] */ "./chunk");