docs: v5.102.0 (#7661)

alexander-akait · web-flow · commit 7393225c0561 · 2025-10-01T18:46:21.000+03:00
diff --git a/src/content/api/normalmodulefactory-hooks.mdx b/src/content/api/normalmodulefactory-hooks.mdx
@@ -152,3 +152,4 @@ Possible default identifiers:
 5. `asset/source`
 6. `asset/resource`
 7. `asset/inline`
+8. `asset/bytes`
diff --git a/src/content/awesome-webpack.mdx b/src/content/awesome-webpack.mdx
@@ -95,7 +95,6 @@ _People passionate about Webpack (In no particular order)_
 - [Worker Loader](https://github.com/webpack/worker-loader): Worker loader module for Webpack. -- _Maintainer_: `Webpack Team` [![Github][githubicon]](https://github.com/webpack)
 - [Resolve URL Loader](https://github.com/bholloway/resolve-url-loader): Resolves relative paths in url() statements. -- _Maintainer_: `Ben Holloway` [![Github][githubicon]](https://github.com/bholloway)
 - [Import Loader](https://github.com/webpack/imports-loader): Imports loader module for Webpack. -- _Maintainer_: `Webpack Team` [![Github][githubicon]](https://github.com/webpack)
-- [SourceMap Loader](https://github.com/webpack/source-map-loader): Extract sourceMappingURL comments from modules. -- _Maintainer_: `Webpack Team` [![Github][githubicon]](https://github.com/webpack)
 - [Combine Loader](https://www.npmjs.com/package/webpack-combine-loaders) - Converts a loaders array into a single loader string. -- _Maintainer_: `James Friend` [![Github][githubicon]](https://github.com/jsdf)
 - [Icon Font Loader](https://github.com/vusion/icon-font-loader) - Converts svgs into font icons in CSS. -- _Maintainer_: `Forrest R. Zhao` [![Github][githubicon]](https://github.com/rainfore)
 - [Icons Loader](https://www.npmjs.com/package/icons-loader) - Generates an iconfont from SVG dependencies. -- _Maintainer_: `Mike Vercoelen` [![Github][githubicon]](https://github.com/mikevercoelen)
diff --git a/src/content/configuration/devtool.mdx b/src/content/configuration/devtool.mdx
@@ -18,8 +18,7 @@ related:
 ---
 
 This option controls if and how source maps are generated.
-
-Use the [`SourceMapDevToolPlugin`](/plugins/source-map-dev-tool-plugin) for a more fine grained configuration. See the [`source-map-loader`](/loaders/source-map-loader) to deal with existing source maps.
+Use the [`SourceMapDevToolPlugin`](/plugins/source-map-dev-tool-plugin) for a more fine grained configuration. See the [`Rule.extractSourceMap`](/configuration/module/#ruleextractsourcemap) to deal with existing source maps.
 
 ## devtool
 
diff --git a/src/content/configuration/experiments.mdx b/src/content/configuration/experiments.mdx
@@ -27,11 +27,11 @@ Available options:
 - [`css`](#experimentscss)
 - [`deferImport`](#experimentsdeferimport)
 - [`futureDefaults`](#experimentsfuturedefaults)
-- `layers`: Enable module and chunk layers.
 - [`lazyCompilation`](#experimentslazycompilation)
 - [`outputModule`](#experimentsoutputmodule)
 - `syncWebAssembly`: Support the old WebAssembly like in webpack 4.
-- [`topLevelAwait`](#experimentstoplevelawait)
+- `layers`: Enable module and chunk layers, removed and works without additional options since `5.102.0`.
+- `topLevelAwait`: Transforms a module into an `async` module when an `await` is used at the top level. Starting from webpack version `5.83.0` (however, in versions prior to that, you can enable it by setting `experiments.topLevelAwait` to `true`), this feature is enabled by default, removed and works without additional options since `5.102.0`.
 
 **webpack.config.js**
 
@@ -41,7 +41,6 @@ module.exports = {
   experiments: {
     asyncWebAssembly: true,
     buildHttp: true,
-    layers: true,
     lazyCompilation: true,
     outputModule: true,
     syncWebAssembly: true,
@@ -368,17 +367,3 @@ module.exports = {
   },
 };
 ```
-
-### experiments.topLevelAwait
-
-`boolean = true`
-
-The `topLevelAwait` option transforms a module into an `async` module when an `await` is used at the top level. Starting from webpack version `5.83.0`, this feature is enabled by default. However, in versions prior to that, you can enable it by setting `experiments.topLevelAwait` to `true`.
-
-```js
-module.exports = {
-  experiments: {
-    topLevelAwait: true,
-  },
-};
-```
diff --git a/src/content/configuration/module.mdx b/src/content/configuration/module.mdx
@@ -141,6 +141,9 @@ module.exports = {
         // type: string | ((pathData: PathData, assetInfo?: AssetInfo) => string)
         outputPath: 'cdn-assets/',
       },
+      'asset/bytes': {
+        // No generator options are supported for this module type yet
+      }
       javascript: {
         // No generator options are supported for this module type yet
       },
@@ -249,6 +252,9 @@ module.exports = {
       'asset/source': {
         // ditto
       },
+      'asset/bytes': {
+        // ditto
+      },
       javascript: {
         // Parser options for javascript modules
         // e.g, enable parsing of require.ensure syntax
@@ -1019,6 +1025,28 @@ module.exports = {
 };
 ```
 
+## Rule.extractSourceMap
+
+`boolean = false`
+
+Extracts existing source map data from files (from their `//# sourceMappingURL` comment), useful for preserving the source maps of third-party libraries.
+
+**webpack.config.js**
+
+```js
+module.exports = {
+  // ...
+  module: {
+    rules: [
+      {
+        test: /\.m?js$/,
+        extractSourceMap: true,
+      },
+    ],
+  },
+};
+```
+
 ## Rule.loader
 
 `Rule.loader` is a shortcut to `Rule.use: [ { loader } ]`. See [`Rule.use`](#ruleuse) and [`UseEntry.loader`](#useentry) for details.
@@ -1280,11 +1308,11 @@ module.exports = {
   module: {
     rules: [
       {
-        test: /\.png/,
+        test: /\.png$/,
         type: 'asset/resource',
       },
       {
-        test: /\.html/,
+        test: /\.html$/,
         type: 'asset/resource',
         generator: {
           filename: 'static/[hash][ext]',
@@ -1444,7 +1472,7 @@ Include all modules that pass test assertion. If you supply a `Rule.test` option
 
 `string`
 
-Possible values: `'javascript/auto' | 'javascript/dynamic' | 'javascript/esm' | 'json' | 'webassembly/sync' | 'webassembly/async' | 'asset' | 'asset/source' | 'asset/resource' | 'asset/inline' | 'css/auto'`
+Possible values: `'javascript/auto' | 'javascript/dynamic' | 'javascript/esm' | 'json' | 'webassembly/sync' | 'webassembly/async' | 'asset' | 'asset/source' | 'asset/resource' | 'asset/inline' | 'asset/bytes' | 'css' | 'css/auto' | 'css/module' | 'css/global'`
 
 `Rule.type` sets the type for a matching module. This prevents defaultRules and their default importing behaviors from occurring. For example, if you want to load a `.json` file through a custom loader, you'd need to set the `type` to `javascript/auto` to bypass webpack's built-in json importing.
 
diff --git a/src/content/configuration/other-options.mdx b/src/content/configuration/other-options.mdx
@@ -260,6 +260,10 @@ module.exports = {
     module: {
       timestamp: true,
     },
+    contextModule: {
+      hash: true,
+      timestamp: true,
+    },
     resolve: {
       timestamp: true,
     },
@@ -337,6 +341,16 @@ Snapshots for building modules.
 - `hash`: Compare content hashes to determine invalidation (more expensive than `timestamp`, but changes less often).
 - `timestamp`: Compare timestamps to determine invalidation.
 
+### contextModule
+
+`object = {hash boolean = true, timestamp boolean = true}`
+
+Snapshots for building context modules.
+
+- `hash`: Compare content hashes to determine invalidation (more expensive than `timestamp`, but changes less often).
+- `timestamp`: Compare timestamps to determine invalidation.
+
+
 ### resolve
 
 `object = {hash boolean = true, timestamp boolean = true}`
diff --git a/src/content/guides/asset-modules.mdx b/src/content/guides/asset-modules.mdx
diff --git a/src/content/loaders/index.mdx b/src/content/loaders/index.mdx
