diff --git a/packages/semi-rspack/README.md b/packages/semi-rspack/README.md
index b93965c7b5..e4bfe5d9d3 100644
--- a/packages/semi-rspack/README.md
+++ b/packages/semi-rspack/README.md
@@ -5,6 +5,9 @@ The plugin is designed for Semi Design, support rspack, provides two major abili
 - Custom theme
 - Replace prefix of CSS selector 
 
+> Note: The plugin detects Semi related dependencies by package path. It supports both
+> `@douyinfe/semi-ui` and version-suffixed packages like `@douyinfe/semi-ui-19` (also for `semi-icons`).
+
 ## Usage 
 
 ### Install 
diff --git a/packages/semi-rspack/src/rule.ts b/packages/semi-rspack/src/rule.ts
index a716fd97a9..e082e57a46 100644
--- a/packages/semi-rspack/src/rule.ts
+++ b/packages/semi-rspack/src/rule.ts
@@ -5,7 +5,8 @@ import { stringifyVariableRecord } from './utils';
 
 export function createSourceSuffixLoaderRule(_opts?: SemiWebpackPluginOptions) {
     return {
-        test: /@douyinfe(\/|\\)+semi-(ui|icons)(\/|\\)+.+\.js$/,
+        // Support packages like @douyinfe/semi-ui-19, @douyinfe/semi-icons-19
+        test: /@douyinfe(\/|\\)+semi-(ui|icons)(-\d+)?(\/|\\)+.+\.js$/,
         use: [{ loader: SOURCE_SUFFIX_LOADER }],
     };
 }
@@ -27,7 +28,8 @@ export function createThemeLoaderRule(opts?: SemiWebpackPluginOptions) {
         cssLayer: opts.cssLayer
     };
     const loaderInfo = {
-        test: /@douyinfe(\/|\\)+semi-(ui|icons|foundation)(\/|\\)+lib(\/|\\)+.+\.scss$/,
+        // Support packages like @douyinfe/semi-ui-19, @douyinfe/semi-foundation-19
+        test: /@douyinfe(\/|\\)+semi-(ui|icons|foundation)(-\d+)?(\/|\\)+lib(\/|\\)+.+\.scss$/,
         use: [{ loader: THEME_LOADER, options }],
     };
     let commonLoader: any[] = [
@@ -101,4 +103,4 @@ export function applySemiRules(opts?: SemiWebpackPluginOptions) {
         rules.push(createWebComponentLoaderRule(opts));
     }
     return rules;
-}
\ No newline at end of file
+}
diff --git a/packages/semi-webpack/README.md b/packages/semi-webpack/README.md
index 077cc9bdd6..0bf4e24208 100644
--- a/packages/semi-webpack/README.md
+++ b/packages/semi-webpack/README.md
@@ -5,6 +5,9 @@ The plugin is designed for Semi Design, support webpack4 and webpack5, provides
 - Custom theme
 - Replace prefix of CSS selector 
 
+> Note: The plugin detects Semi related dependencies by package path. It supports both
+> `@douyinfe/semi-ui` and version-suffixed packages like `@douyinfe/semi-ui-19` (also for `semi-icons`).
+
 ## Usage 
 
 ### Install 
@@ -166,4 +169,4 @@ Type: `(loaderList:any[])=>any[]`
 You can customize how webpack process semi related styles by override the loader with this option. The function will receive the loader list of default loaders(include options.extractCssOptions) and you should return your new loader list. The best practice is just only add your loader to the list rather than delete or change the default loaders since some core logic is in there.
 
 
-In webpack@5, some hooks need to be obtained through api `NormalModule.getCompilationHooks`. But in some scenarios, webpack will not be installed, such as Next.js. Therefore, the user is required to pass in NormalModule as a parameter.
\ No newline at end of file
+In webpack@5, some hooks need to be obtained through api `NormalModule.getCompilationHooks`. But in some scenarios, webpack will not be installed, such as Next.js. Therefore, the user is required to pass in NormalModule as a parameter.
diff --git a/packages/semi-webpack/src/semi-webpack-plugin.ts b/packages/semi-webpack/src/semi-webpack-plugin.ts
index 4ad3c14291..93bf472849 100644
--- a/packages/semi-webpack/src/semi-webpack-plugin.ts
+++ b/packages/semi-webpack/src/semi-webpack-plugin.ts
@@ -29,6 +29,11 @@ export interface SemiThemeOptions {
     name?: string
 }
 
+// Support packages like @douyinfe/semi-ui-19, @douyinfe/semi-icons-19
+// Only allow numeric suffix to avoid over-matching non-Semi packages.
+const SEMI_LIB_JS_RE = /@douyinfe\/semi-(ui|icons)(-\d+)?\/lib\/.+\.js$/;
+const SEMI_LIB_SCSS_RE = /@douyinfe\/semi-(ui|icons|foundation)(-\d+)?\/lib\/.+\.scss$/;
+
 export default class SemiWebpackPlugin {
 
     options: SemiWebpackPluginOptions;
@@ -92,7 +97,7 @@ export default class SemiWebpackPlugin {
 
     omitCss(module: any) {
         const compatiblePath = transformPath(module.resource);
-        if (/@douyinfe\/semi-(ui|icons)\/lib\/.+\.js$/.test(compatiblePath)) {
+        if (SEMI_LIB_JS_RE.test(compatiblePath)) {
             module.loaders = module.loaders || [];
             module.loaders.push({
                 loader: path.join(__dirname, 'semi-omit-css-loader')
@@ -102,13 +107,13 @@ export default class SemiWebpackPlugin {
 
     customTheme(module: any) {
         const compatiblePath = transformPath(module.resource);
-        if (/@douyinfe\/semi-(ui|icons)\/lib\/.+\.js$/.test(compatiblePath)) {
+        if (SEMI_LIB_JS_RE.test(compatiblePath)) {
             module.loaders = module.loaders || [];
             module.loaders.push({
                 loader: path.join(__dirname, 'semi-source-suffix-loader')
             });
         }
-        if (/@douyinfe\/semi-(ui|icons|foundation)\/lib\/.+\.scss$/.test(compatiblePath)) {
+        if (SEMI_LIB_SCSS_RE.test(compatiblePath)) {
             const scssLoader = require.resolve('sass-loader');
             const cssLoader = require.resolve('css-loader');
             const styleLoader = require.resolve('style-loader');
@@ -199,4 +204,3 @@ export default class SemiWebpackPlugin {
         }, '');
     }
 }
-