diff --git a/.antd-tools.config.js b/.antd-tools.config.js
index 7a5bec367..7118b5000 100644
--- a/.antd-tools.config.js
+++ b/.antd-tools.config.js
@@ -96,7 +96,7 @@ function finalizeDist() {
       `
 function getThemeVariables(options = {}) {
   let themeVar = {
-    'hack': \`true;@import "\${require.resolve('antd/lib/style/color/colorPalette.less')}";\`,
+    'hack': \`true;@import "\${require.resolve('ant-design-vue/lib/style/color/colorPalette.less')}";\`,
     ...defaultTheme
   };
   if(options.dark) {
diff --git a/antd-tools/getWebpackConfig.js b/antd-tools/getWebpackConfig.js
index 609cac974..95d739152 100644
--- a/antd-tools/getWebpackConfig.js
+++ b/antd-tools/getWebpackConfig.js
@@ -8,6 +8,7 @@ const MiniCssExtractPlugin = require('mini-css-extract-plugin');
 const CssMinimizerPlugin = require('css-minimizer-webpack-plugin');
 const CaseSensitivePathsPlugin = require('case-sensitive-paths-webpack-plugin');
 const CleanUpStatsPlugin = require('./utils/CleanUpStatsPlugin');
+const FilterWarningsPlugin = require('webpack-filter-warnings-plugin');
 // const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
 
 const distFileBaseName = 'antd';
@@ -75,7 +76,7 @@ function getWebpackConfig(modules) {
         'readline',
         'repl',
         'tls',
-      ].reduce((acc, name) => Object.assign({}, acc, { [name]: false }), {}),
+      ].reduce((acc, name) => Object.assign({}, acc, { [name]: 'empty' }), {}),
     },
 
     module: {
@@ -173,9 +174,9 @@ function getWebpackConfig(modules) {
               loader: 'less-loader',
               options: {
                 lessOptions: {
-                  sourceMap: true,
                   javascriptEnabled: true,
                 },
+                sourceMap: true,
               },
             },
           ],
@@ -208,6 +209,12 @@ All rights reserved.
         color: '#2f54eb',
       }),
       new CleanUpStatsPlugin(),
+      new FilterWarningsPlugin({
+        // suppress conflicting order warnings from mini-css-extract-plugin.
+        // ref: https://github.com/ant-design/ant-design/issues/14895
+        // see https://github.com/webpack-contrib/mini-css-extract-plugin/issues/250
+        exclude: /mini-css-extract-plugin[^]*Conflicting order between:/,
+      }),
     ],
     performance: {
       hints: false,
@@ -274,7 +281,7 @@ All rights reserved.
     return [prodConfig, uncompressedConfig];
   }
 
-  return config;
+  return [config];
 }
 
 getWebpackConfig.webpack = webpack;
diff --git a/components/progress/Line.tsx b/components/progress/Line.tsx
index db01a2e6c..924bfc6b1 100644
--- a/components/progress/Line.tsx
+++ b/components/progress/Line.tsx
@@ -1,4 +1,5 @@
 import type { CSSProperties, ExtractPropTypes, PropType } from 'vue';
+import { presetPrimaryColors } from '@ant-design/colors';
 import { computed, defineComponent } from 'vue';
 import type { Direction } from '../config-provider';
 import PropTypes from '../_util/vue-types';
@@ -55,8 +56,8 @@ export const sortGradient = (gradients: StringGradients) => {
  */
 export const handleGradient = (strokeColor: ProgressGradient, directionConfig: Direction) => {
   const {
-    from = '#1890ff',
-    to = '#1890ff',
+    from = presetPrimaryColors.blue,
+    to = presetPrimaryColors.blue,
     direction = directionConfig === 'rtl' ? 'to left' : 'to right',
     ...rest
   } = strokeColor;
diff --git a/index-style-only.js b/index-style-only.js
new file mode 100644
index 000000000..b926d7ccd
--- /dev/null
+++ b/index-style-only.js
@@ -0,0 +1,24 @@
+function pascalCase(name) {
+  return name.charAt(0).toUpperCase() + name.slice(1).replace(/-(\w)/g, (m, n) => n.toUpperCase());
+}
+
+// Just import style for https://github.com/ant-design/ant-design/issues/3745
+const req = require.context('./components', true, /^\.\/[^_][\w-]+\/style\/index\.tsx?$/);
+
+req.keys().forEach(mod => {
+  let v = req(mod);
+  if (v && v.default) {
+    v = v.default;
+  }
+  const match = mod.match(/^\.\/([^_][\w-]+)\/index\.tsx?$/);
+  if (match && match[1]) {
+    if (match[1] === 'message' || match[1] === 'notification') {
+      // message & notification should not be capitalized
+      exports[match[1]] = v;
+    } else {
+      exports[pascalCase(match[1])] = v;
+    }
+  }
+});
+
+module.exports = exports;
diff --git a/index-with-locales.js b/index-with-locales.js
index f094476c9..3cb8b9f7d 100644
--- a/index-with-locales.js
+++ b/index-with-locales.js
@@ -1,11 +1,12 @@
 const antd = require('./components');
-const req = require.context('./components', true, /^\.\/locale-provider\/(?!__tests__).+_.+\.ts$/);
+
+const req = require.context('./components', true, /^\.\/locale\/.+_.+\.tsx$/);
 
 antd.locales = {};
 
 req.keys().forEach(mod => {
-  const match = mod.match(/\/([^/]+).ts$/);
-  antd.locales[match[1]] = req(mod).default;
+  const matches = mod.match(/\/([^/]+).tsx$/);
+  antd.locales[matches[1]] = req(mod).default;
 });
 
 module.exports = antd;
diff --git a/index.js b/index.js
index 1cbf08802..bfa504760 100644
--- a/index.js
+++ b/index.js
@@ -1,30 +1,3 @@
-/* eslint no-console:0 */
-function camelCase(name) {
-  return (
-    name.charAt(0).toUpperCase() +
-    name.slice(1).replace(/-(\w)/g, (m, n) => {
-      return n.toUpperCase();
-    })
-  );
-}
-
-// Just import style for https://github.com/ant-design/ant-design/issues/3745
-const req = require.context('./components', true, /^\.\/[^_][\w-]+\/style\/index\.tsx?$/);
-
-req.keys().forEach(mod => {
-  let v = req(mod);
-  if (v && v.default) {
-    v = v.default;
-  }
-  const match = mod.match(/^\.\/([^_][\w-]+)\/index\.tsx?$/);
-  if (match && match[1]) {
-    if (match[1] === 'message' || match[1] === 'notification') {
-      // message & notification should not be capitalized
-      exports[match[1]] = v;
-    } else {
-      exports[camelCase(match[1])] = v;
-    }
-  }
-});
+require('./index-style-only');
 
 module.exports = require('./components');
diff --git a/package.json b/package.json
index 07c61b1e0..98adf735b 100644
--- a/package.json
+++ b/package.json
@@ -151,8 +151,10 @@
     "date-fns": "^2.24.0",
     "diacritics": "^1.3.0",
     "docsearch.js": "^2.6.3",
+    "duplicate-package-checker-webpack-plugin": "^3.0.0",
     "enquire-js": "^0.2.1",
     "esbuild": "~0.12.29",
+    "esbuild-loader": "^2.18.0",
     "escape-html": "^1.0.3",
     "eslint": "^8.3.0",
     "eslint-config-prettier": "^8.0.0",
@@ -196,7 +198,7 @@
     "markdown-it-table-of-contents": "^0.5.2",
     "marked": "0.3.18",
     "merge2": "^1.2.1",
-    "mini-css-extract-plugin": "^1.5.0",
+    "mini-css-extract-plugin": "^2.4.5",
     "minimist": "^1.2.0",
     "mkdirp": "^0.5.1",
     "mockdate": "^2.0.2",
@@ -216,12 +218,14 @@
     "remark-parse": "^8.0.0",
     "remark-stringify": "^8.0.0",
     "remark-yaml-config": "^4.1.0",
+    "remove-files-webpack-plugin": "^1.5.0",
     "reqwest": "^2.0.5",
     "rimraf": "^3.0.0",
     "rucksack-css": "^1.0.2",
     "selenium-server": "^3.0.1",
     "semver": "^7.0.0",
     "slash": "^3.0.0",
+    "string-replace-loader": "^3.1.0",
     "style-loader": "^3.0.0",
     "stylelint": "^13.0.0",
     "stylelint-config-prettier": "^8.0.0",
@@ -257,12 +261,13 @@
     "webpack-bundle-analyzer": "^4.4.2",
     "webpack-cli": "^4.6.0",
     "webpack-dev-server": "^4.0.0",
+    "webpack-filter-warnings-plugin": "^1.2.1",
     "webpack-merge": "^5.0.0",
-    "webpackbar": "^5.0.0-3",
+    "webpackbar": "^5.0.2",
     "xhr-mock": "^2.5.1"
   },
   "dependencies": {
-    "@ant-design/colors": "^6.0.0",
+    "@ant-design/colors": "^5.0.0",
     "@ant-design/icons-vue": "^6.0.0",
     "@babel/runtime": "^7.10.5",
     "@simonwep/pickr": "~1.8.0",
diff --git a/webpack.build.conf.js b/webpack.build.conf.js
index 3341339b5..915bcb98c 100644
--- a/webpack.build.conf.js
+++ b/webpack.build.conf.js
@@ -7,7 +7,6 @@ const DuplicatePackageCheckerPlugin = require('duplicate-package-checker-webpack
 const getWebpackConfig = require('./antd-tools/getWebpackConfig');
 const darkVars = require('./scripts/dark-vars');
 const compactVars = require('./scripts/compact-vars');
-
 function injectLessVariables(config, variables) {
   (Array.isArray(config) ? config : [config]).forEach(conf => {
     conf.module.rules.forEach(rule => {
@@ -89,22 +88,8 @@ function processWebpackThemeConfig(themeConfig, theme, vars) {
       delete config.entry[entryName];
     });
 
-    // apply ${theme} less variables
-    config.module.rules.forEach(rule => {
-      // filter less rule
-      if (rule.test instanceof RegExp && rule.test.test('.less')) {
-        const lessRule = rule.use[rule.use.length - 1];
-        if (lessRule.options.lessOptions) {
-          lessRule.options.lessOptions.modifyVars = vars;
-        } else {
-          lessRule.options.modifyVars = vars;
-        }
-      }
-    });
-
     // apply ${theme} less variables
     injectLessVariables(config, vars);
-
     // ignore emit ${theme} entry js & js.map file
     config.plugins.push(
       new RemovePlugin({