docs: more about v5.103.0 (#7722)

Author: hai-x

src/content/configuration/dotenv.mdx

@@ -12,7 +12,7 @@ related:
 
 <Badge text="5.103.0+" />
 The `dotenv` option enables webpack's built-in environment variable loading from
-`.env` files. ## `dotenv`
+`.env` files.
 
 `boolean` `object`
 

src/content/configuration/experiments.mdx

@@ -69,7 +69,6 @@ module.exports = {
 When enabled, webpack can build remote resources that begin with the `http(s):` protocol.
 
 - Type:
-
   - `(string | RegExp | ((uri: string) => boolean))[]`
 
     A shortcut for [`experiments.buildHttp.allowedUris`](#experimentsbuildhttpalloweduris).
@@ -223,9 +222,12 @@ Enables the following syntaxes:
 
 ```js
 import defer * as module from 'module-name';
-// or
 import * as module2 from /* webpackDefer: true */ 'module-name2';
 
+// Or using dynamic import
+import.defer('module-name3');
+import(/* webpackDefer: true */ 'module-name4');
+
 export function f() {
   // module-name is evaluated synchronously, then call doSomething() on it.
   module.doSomething();
@@ -251,12 +253,7 @@ Esbuild is _not_ compatible with this feature (see [evanw/esbuild#1439](https://
 
 #### Not implemented
 
-The asynchronous form of this proposal is not implemented yet.
-
-```js
-import.defer('module-name'); // not implemented
-import(/* webpackDefer: true */ 'module-name'); // not implemented
-```
+import.defer() is not yet supported for ContextModule (the import path is a dynamic expression).
 
 ### experiments.futureDefaults
 
@@ -278,7 +275,6 @@ module.exports = {
 Compile entrypoints and dynamic `import`s only when they are in use. It can be used for either Web or Node.js.
 
 - Type
-
   - `boolean`
   - `object`
 

src/content/configuration/module.mdx

@@ -748,6 +748,50 @@ The `'relative'` value for `module.parser.javascript.url` is available since web
 1. This is useful for SSR (Server side rendering) when base URL is not known by server (and it saves a few bytes). To be identical it must also be used for the client build.
 2. Also for static site generators, mini-css-plugin and html-plugin, etc. where server side rendering is commonly needed.
 
+#### module.parser.javascript.parse
+
+<Badge text="5.103.0+" />
+
+Use a custom JavaScript parse function instead of webpack's built-in parser.
+
+Return `ast`, `comments`, and `semicolons` to ensure webpack’s AST analysis works correctly.
+
+- `ast` should be ESTree-compatible.
+- `comments` is an array of ESTree comment nodes.
+- `semicolons` is a set of positions where the parser inserted a semicolon.
+
+- Type: `(code: string, options: ParseOptions) => ParseResult`
+- Example:
+
+  ```js
+  module.exports = {
+    module: {
+      parser: {
+        javascript: {
+          parse: (code, options) => {
+            const comments = [];
+            const semicolons = new Set();
+            const onInsertedSemicolon = (pos) => semicolons.add(pos);
+
+            const parseOptions = {
+              ...options,
+              module: options.sourceType === 'module',
+              loc: options.locations,
+              onComment: options.comments ? comments : undefined,
+              onInsertedSemicolon: options.semicolons
+                ? onInsertedSemicolon
+                : undefined,
+            };
+
+            const ast = meriyah.parse(code, parseOptions);
+            return { ast, comments, semicolons };
+          },
+        },
+      },
+    },
+  };
+  ```
+
 ### module.parser.json
 
 Configure options for json parser.

src/content/guides/output-management.mdx

@@ -216,7 +216,7 @@ Now run an `npm run build` and inspect the `/dist` folder. If everything went we
 
 You might be wondering how webpack and its plugins seem to "know" what files are being generated. The answer is in the manifest that webpack keeps to track how all the modules map to the output bundles. If you're interested in managing webpack's [`output`](/configuration/output) in other ways, the manifest would be a good place to start.
 
-The manifest data can be extracted into a json file for consumption using the [`WebpackManifestPlugin`](https://github.com/shellscape/webpack-manifest-plugin).
+The manifest data can be extracted into a json file for consumption using the [`ManifestPlugin`](/plugins/manifest-plugin/).
 
 We won't go through a full example of how to use this plugin within your projects, but you can read up on [the concept page](/concepts/manifest) and the [caching guide](/guides/caching) to find out how this ties into long term caching.
 

src/content/plugins/eval-source-map-dev-tool-plugin.mdx

@@ -26,9 +26,9 @@ new webpack.EvalSourceMapDevToolPlugin(options);
 
 The following options are supported:
 
-- `test` (`string|RegExp|array`): Include source maps for modules based on their extension (defaults to `.js` and `.css`).
-- `include` (`string|RegExp|array`): Include source maps for module paths that match the given value.
-- `exclude` (`string|RegExp|array`): Exclude modules that match the given value from source map generation.
+- `test` (`string` `RegExp` `function (asset) => boolean` `[string, RegExp, function (asset) => boolean]`): Include source maps for modules based on their extension (defaults to `.js` and `.css`).
+- `include` (`string` `RegExp` `function (asset) => boolean` `[string, RegExp, function (asset) => boolean]`): Include source maps for module paths that match the given value.
+- `exclude` (`string` `RegExp` `function (asset) => boolean` `[string, RegExp, function (asset) => boolean]`): Exclude modules that match the given value from source map generation.
 - `append` (`string|function`): Appends the given value to the original asset. Usually the `#sourceMappingURL` comment. `[url]` is replaced with a URL to the source map file.
 
   Starting from version 5.84.0, webpack allows the `append` option to be a function that accepts path data and an asset info object as arguments, and returns a string.
@@ -37,7 +37,7 @@ The following options are supported:
   (pathData: PathData, assetInfo?: AssetInfo) => string;
   ```
 
-- `ignoreList` (`string|RegExp|array`): Decide whether to ignore source files that match the specified value in source maps.
+- `ignoreList` (`string` `RegExp` `function (source) => boolean` `[string, RegExp, function (source) => boolean]`): Decide whether to ignore source files that match the specified value in source maps.
 - `module` (`boolean`): Indicates whether loaders should generate source maps (defaults to `true`).
 - `moduleFilenameTemplate` (`string`): See [`output.devtoolModuleFilenameTemplate`](/configuration/output/#outputdevtoolmodulefilenametemplate).
 - `columns` (`boolean`): Indicates whether column mappings should be used (defaults to `true`).

src/content/plugins/manifest-plugin.mdx

@@ -0,0 +1,106 @@
+---
+title: ManifestPlugin
+group: webpack
+contributors:
+  - hai-x
+  - alexander-akait
+---
+
+<Badge text="5.103.0+" />
+
+The built-in `ManifestPlugin` generates one asset manifest for your build. Port from [`WebpackManifestPlugin`](https://github.com/shellscape/webpack-manifest-plugin).
+
+**webpack.config.js**
+
+```javascript
+new webpack.ManifestPlugin({
+  // options...
+});
+```
+
+## Options
+
+### `entrypoints`
+
+`boolean = true`
+
+Enables generation of the `entrypoints` section in the manifest.
+
+When `entrypoints` is enabled and one entry uses `dependOn`
+
+**webpack.config.js**
+
+```javascript
+module.exports = {
+  entry: {
+    entry1: {
+      import: './src/file_1.js',
+      dependOn: 'entry2',
+    },
+    entry2: './src/file_2.js',
+  },
+  plugins: [
+    new webpack.ManifestPlugin({
+      filename: 'manifest.json',
+    }),
+  ],
+};
+```
+
+The resulting manifest will contain the parent/child relationship map
+
+**manifest.json**
+
+```json
+{
+  "entrypoints": {
+    "entry1": {
+      "imports": ["entry1.js"],
+      "parents": ["entry2"]
+    },
+    "entry2": {
+      "imports": ["entry2.js"]
+    }
+  }
+}
+```
+
+### `filename`
+
+`string = manifest.json`
+
+Specifies the filename of the output file on disk. By default the plugin will emit `manifest.json` inside the `output.path` directory.
+
+### `filter`
+
+`(item: ManifestItem) => boolean`
+
+Allows filtering the files which make up the manifest.
+
+### `generate`
+
+`function (manifest: ManifestObject) => ManifestObject`
+
+Receives the manifest object, modifies it, and returns the modified manifest.
+
+### `prefix`
+
+`string = "[publicpath]"`
+
+Specifies a path prefix for all keys in the manifest.
+
+### serialize
+
+`function (manifest: ManifestObject) => string = (manifest) => JSON.stringify(manifest, null, 2)`
+
+Receives the manifest object and returns the manifest string.
+
+Use `serialize` to output other formats, for example YAML:
+
+```javascript
+new webpack.ManifestPlugin({
+  serialize(manifest) {
+    return YAML.stringify(manifest, 4);
+  },
+});
+```

src/content/plugins/source-map-dev-tool-plugin.mdx

@@ -24,9 +24,9 @@ new webpack.SourceMapDevToolPlugin(options);
 
 The following options are supported:
 
-- `test` (`string` `RegExp` `[string, RegExp]`): Include source maps for modules based on their extension (defaults to `.js`, `.mjs`, and `.css`).
-- `include` (`string` `RegExp` `[string, RegExp]`): Include source maps for module paths that match the given value.
-- `exclude` (`string` `RegExp` `[string, RegExp]`): Exclude modules that match the given value from source map generation.
+- `test` (`string` `RegExp` `function (asset) => boolean` `[string, RegExp, function (asset) => boolean]`): Include source maps for modules based on their extension (defaults to `.js`, `.mjs`, and `.css`).
+- `include` (`string` `RegExp` `function (asset) => boolean` `[string, RegExp, function (asset) => boolean]`): Include source maps for module paths that match the given value.
+- `exclude` (`string` `RegExp` `function (asset) => boolean` `[string, RegExp], function (asset) => boolean`): Exclude modules that match the given value from source map generation.
 - `filename` (`string`): Defines the output filename of the SourceMap (will be inlined if no value is provided).
 - `append` (`string` `function` `false`): Appends the given value to the original asset. Usually the `#sourceMappingURL` comment. `[url]` is replaced with a URL to the source map file. Since webpack v4.36.0, path parameters are supported: `[chunk]`, `[filename]` and `[contenthash]`. Setting `append` to `false` disables the appending.
 
@@ -38,7 +38,7 @@ The following options are supported:
 
 - `moduleFilenameTemplate` (`string`): See [`output.devtoolModuleFilenameTemplate`](/configuration/output/#outputdevtoolmodulefilenametemplate).
 - `fallbackModuleFilenameTemplate` (`string`): See link above.
-- `ignoreList` (`string|RegExp|array`): Decide whether to ignore source files that match the specified value in source maps.
+- `ignoreList` (`string` `RegExp` `function (source) => boolean` `[string, RegExp, function (source) => boolean]`): Decide whether to ignore source files that match the specified value in source maps.
 - `module = true` (`boolean`): Indicates whether loaders should generate source maps.
 - `columns = true` (`boolean`): Indicates whether column mappings should be used.
 - `namespace` (`string`): Namespace prefix to allow multiple webpack roots in the devtools. See [`output.devtoolNamespace`](/configuration/output/#outputdevtoolnamespace).