Update webpack to 5.108.1

packages/dependency-extraction-webpack-plugin/CHANGELOG.md

@@ -2,6 +2,10 @@
 
 ## Unreleased
 
+### Bug Fixes
+
+-   Extract dynamically imported external modules that webpack code-splits into their own async chunk in the module build ([#79633](https://github.com/WordPress/gutenberg/pull/79633)).
+
 ## 6.49.0 (2026-06-24)
 
 ## 6.48.1 (2026-06-16)

packages/dependency-extraction-webpack-plugin/lib/index.js

@@ -296,12 +296,24 @@ class DependencyExtractionWebpackPlugin {
 
 			/**
 			 * @param {webpack.Module} m
+			 * @param {boolean}        [fromAsyncChunk] Module was found in an
+			 *                                          async chunk of the entry.
 			 */
-			const processModule = ( m ) => {
+			const processModule = ( m, fromAsyncChunk ) => {
 				const { userRequest } = m;
 				if ( this.externalizedDeps.has( userRequest ) ) {
 					if ( this.useModules ) {
+						// A static occurrence (in the entry chunk) wins.
+						if (
+							fromAsyncChunk &&
+							chunkStaticDeps.has( m.request )
+						) {
+							return;
+						}
+						// Externals in an async chunk are reached via a dynamic
+						// import by definition.
 						const isStatic =
+							! fromAsyncChunk &&
 							DependencyExtractionWebpackPlugin.hasStaticDependencyPathToRoot(
 								compilation,
 								m
@@ -318,16 +330,49 @@ class DependencyExtractionWebpackPlugin {
 				}
 			};
 
-			// Search for externalized modules in all chunks.
-			for ( const chunkModule of compilation.chunkGraph.getChunkModulesIterable(
-				chunk
-			) ) {
-				processModule( chunkModule );
-				// Loop through submodules of ConcatenatedModule.
-				if ( chunkModule.modules ) {
-					for ( const concatModule of chunkModule.modules ) {
-						processModule( concatModule );
+			/**
+			 * @param {webpack.Chunk} searchChunk
+			 * @param {boolean}       [fromAsyncChunk]
+			 */
+			const processChunkModules = ( searchChunk, fromAsyncChunk ) => {
+				for ( const chunkModule of compilation.chunkGraph.getChunkModulesIterable(
+					searchChunk
+				) ) {
+					processModule( chunkModule, fromAsyncChunk );
+					// Loop through submodules of ConcatenatedModule.
+					if ( chunkModule.modules ) {
+						for ( const concatModule of chunkModule.modules ) {
+							processModule( concatModule, fromAsyncChunk );
+						}
+					}
+				}
+			};
+
+			processChunkModules( chunk );
+
+			/*
+			 * Also search the entry's async chunks: webpack can code-split a
+			 * dynamically imported external into its own chunk.
+			 */
+			for ( const group of chunk.groupsIterable ) {
+				if (
+					typeof group.getEntrypointChunk !== 'function' ||
+					group.getEntrypointChunk() !== chunk
+				) {
+					continue;
+				}
+				const seenGroups = new Set();
+				const groupQueue = [ ...group.getChildren() ];
+				while ( groupQueue.length ) {
+					const childGroup = groupQueue.pop();
+					if ( seenGroups.has( childGroup ) ) {
+						continue;
+					}
+					seenGroups.add( childGroup );
+					for ( const asyncChunk of childGroup.chunks ) {
+						processChunkModules( asyncChunk, true );
 					}
+					groupQueue.push( ...childGroup.getChildren() );
 				}
 			}
 

packages/dependency-extraction-webpack-plugin/package.json

@@ -46,7 +46,8 @@
 		"glob": "^7.1.2",
 		"lodash": "^4.17.21",
 		"mini-css-extract-plugin": "^2.9.2",
-		"mkdirp": "^3.0.1"
+		"mkdirp": "^3.0.1",
+		"webpack": "^5.108.1"
 	},
 	"peerDependencies": {
 		"webpack": "^5.0.0"

packages/dependency-extraction-webpack-plugin/test/fixtures/nested-dynamic-import/index.js

@@ -0,0 +1,3 @@
+// Two levels of dynamic import before reaching the external module, so it is
+// code-split into a nested async chunk.
+await import( './level-one.js' );

packages/dependency-extraction-webpack-plugin/test/fixtures/nested-dynamic-import/level-one.js

@@ -0,0 +1,6 @@
+/**
+ * WordPress dependencies
+ */
+const { store } = await import( '@wordpress/interactivity' );
+
+store( 'nested', { state: {} } );

packages/dependency-extraction-webpack-plugin/test/fixtures/nested-dynamic-import/webpack.config.js

@@ -0,0 +1,8 @@
+/**
+ * Internal dependencies
+ */
+const DependencyExtractionWebpackPlugin = require( '../../..' );
+
+module.exports = {
+	plugins: [ new DependencyExtractionWebpackPlugin() ],
+};

packages/scripts/package.json

@@ -89,7 +89,7 @@
 		"stylelint": "^16.8.2",
 		"terser-webpack-plugin": "^5.3.10",
 		"url-loader": "^4.1.1",
-		"webpack": "^5.97.0",
+		"webpack": "^5.108.1",
 		"webpack-bundle-analyzer": "^4.9.1",
 		"webpack-cli": "^5.1.4",
 		"webpack-dev-server": "^4.15.1"