From 2b3567ea3987f3a9510b5cc556f4faedfe504a2f Mon Sep 17 00:00:00 2001
From: sapenlei <2503404258gl@gmail.com>
Date: Sat, 21 Dec 2024 15:46:34 +0800
Subject: [PATCH] docs(resolve): and wildcard alias configuration

---
 src/content/configuration/resolve.mdx | 23 +++++++++++++++++++++++
 1 file changed, 23 insertions(+)

diff --git a/src/content/configuration/resolve.mdx b/src/content/configuration/resolve.mdx
index 958cc0c7625b..06bcb3517fa0 100644
--- a/src/content/configuration/resolve.mdx
+++ b/src/content/configuration/resolve.mdx
@@ -18,6 +18,7 @@ contributors:
   - chenxsan
   - jamesgeorge007
   - snitin315
+  - sapenlei
 ---
 
 These options change how modules are resolved. Webpack provides reasonable defaults, but it is possible to change the resolving in detail. Have a look at [Module Resolution](/concepts/module-resolution) for more explanation of how the resolver works.
@@ -97,6 +98,28 @@ import Test1 from 'xyz'; // Exact match, so path/to/file.js is resolved and impo
 import Test2 from 'xyz/file.js'; // Not an exact match, normal resolution takes place
 ```
 
+You can also use wildcards (`*`) in your alias configuration to create more flexible mappings:
+
+**webpack.config.js**
+
+```js
+module.exports = {
+  //...
+  resolve: {
+    alias: {
+      '@*': path.resolve(__dirname, 'src/*'), // maps @something to path/to/something
+    },
+  },
+};
+```
+
+This allows you to use imports like:
+
+```js
+import Component from '@components/Button';
+import utils from '@utils/helpers';
+```
+
 The following table explains other cases:
 
 | `alias:`                           | `import 'xyz'`                        | `import 'xyz/file.js'`               |