From 3ed497b2dab219af3f3b6d1c26c5d0b5a6bbec24 Mon Sep 17 00:00:00 2001 From: Nitin Kumar Date: Sat, 24 Aug 2024 18:17:01 +0530 Subject: [PATCH 1/3] docs: add `Rule.with` --- src/content/configuration/module.mdx | 29 ++++++++++++++++++++++++++++ 1 file changed, 29 insertions(+) diff --git a/src/content/configuration/module.mdx b/src/content/configuration/module.mdx index 8f02ae730869..ed7e5858c249 100644 --- a/src/content/configuration/module.mdx +++ b/src/content/configuration/module.mdx @@ -1503,6 +1503,35 @@ module.exports = { W> `resolve.fullySpecified` doesn't affect requests from [mainFields](/configuration/resolve/#resolvemainfields), [aliasFields](/configuration/resolve/#resolvealiasfields) or [aliases](/configuration/resolve/#resolvealias). +## Rule.with + +A [`Condition`](#condition) that allows you to match the imports based on specific conditions provided with the `with` keyword, enabling different rules to be applied based on the content type. + +**webpack.config.js** + +```javascript +module.exports = { + // ... + module: { + rules: [ + { + // Handles imports with the condition "with { type: 'json' }" + with: { type: 'json' }, + loader: require.resolve('./loader-assert.js'), + }, + ], + }, +}; +``` + +**index.js** + +```javascript +import one from './pkg-1.json' with { type: 'json' }; +``` + +In this example, `Rule.with` is used to apply `loader-assert.js` to any module imported with the condition `with { type: "json" }`. + ## Condition Conditions can be one of these: From d36b8bcba1d21e85e89143eedb28536a341c3acd Mon Sep 17 00:00:00 2001 From: Nitin Kumar Date: Sat, 24 Aug 2024 18:19:05 +0530 Subject: [PATCH 2/3] docs: add supported version --- src/content/configuration/module.mdx | 2 ++ 1 file changed, 2 insertions(+) diff --git a/src/content/configuration/module.mdx b/src/content/configuration/module.mdx index ed7e5858c249..3737fa5c1a9f 100644 --- a/src/content/configuration/module.mdx +++ b/src/content/configuration/module.mdx @@ -1505,6 +1505,8 @@ W> `resolve.fullySpecified` doesn't affect requests from [mainFields](/configura ## Rule.with + + A [`Condition`](#condition) that allows you to match the imports based on specific conditions provided with the `with` keyword, enabling different rules to be applied based on the content type. **webpack.config.js** From dbb7765ec021f93fbfce968717fc4904f844e23f Mon Sep 17 00:00:00 2001 From: Nitin Kumar Date: Sat, 24 Aug 2024 18:19:57 +0530 Subject: [PATCH 3/3] docs: add supported version --- src/content/configuration/module.mdx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/content/configuration/module.mdx b/src/content/configuration/module.mdx index 3737fa5c1a9f..0d862799a9ea 100644 --- a/src/content/configuration/module.mdx +++ b/src/content/configuration/module.mdx @@ -1505,7 +1505,7 @@ W> `resolve.fullySpecified` doesn't affect requests from [mainFields](/configura ## Rule.with - + A [`Condition`](#condition) that allows you to match the imports based on specific conditions provided with the `with` keyword, enabling different rules to be applied based on the content type.