diff --git a/Assets/js/components/Configure/index.tsx b/Assets/js/components/Configure/index.tsx
deleted file mode 100644
index cf02223c..00000000
--- a/Assets/js/components/Configure/index.tsx
+++ /dev/null
@@ -1,14 +0,0 @@
-import React, { memo, useContext } from 'react';
-
-import { ConfigProvider } from 'antd';
-import { ConfigProviderProps } from 'antd/es/config-provider';
-
-const { ConfigContext } = ConfigProvider;
-
-export type { ConfigProviderProps };
-
-export default memo(function Configure(props: ConfigProviderProps): React.ReactElement {
-  const context = useContext(ConfigContext);
-
-  return <ConfigProvider {...context} {...props} />;
-});
diff --git a/Assets/js/components/Document/index.tsx b/Assets/js/components/Document/index.tsx
index 38e74bea..db9e7716 100644
--- a/Assets/js/components/Document/index.tsx
+++ b/Assets/js/components/Document/index.tsx
@@ -1,9 +1,9 @@
 import React, { memo, useMemo } from 'react';
 
+import { ConfigProvider } from 'antd';
 import zhCN from 'antd/es/locale/zh_CN';
 import { Meta } from '/js/utils/router';
 import useTitle from '/js/hooks/useTitle';
-import Configure from '/js/components/Configure';
 import { Outlet, useMatches } from 'react-nest-router';
 
 export default memo(function Document(): React.ReactElement {
@@ -23,8 +23,8 @@ export default memo(function Document(): React.ReactElement {
   useTitle(title);
 
   return (
-    <Configure virtual locale={zhCN}>
+    <ConfigProvider virtual locale={zhCN}>
       <Outlet />
-    </Configure>
+    </ConfigProvider>
   );
 });
diff --git a/Assets/js/components/FlexDrawer/index.tsx b/Assets/js/components/FlexDrawer/index.tsx
index e59f37c7..d60307e3 100644
--- a/Assets/js/components/FlexDrawer/index.tsx
+++ b/Assets/js/components/FlexDrawer/index.tsx
@@ -2,8 +2,7 @@ import React, { memo, useCallback, useRef } from 'react';
 
 import useMedia from '/js/hooks/useMedia';
 import { isString } from '/js/utils/utils';
-import { Drawer, DrawerProps } from 'antd';
-import Configure from '/js/components/Configure';
+import { ConfigProvider, Drawer, DrawerProps } from 'antd';
 
 const containerStyle: React.CSSProperties = { position: 'relative' };
 
@@ -37,9 +36,9 @@ export default memo(function FlexDrawer({
   return (
     <Drawer {...restProps} width={isBreakWidth ? breakWidth : width} height={isBreakHeight ? breakHeight : height}>
       <div ref={containerRef} style={containerStyle}>
-        <Configure getPopupContainer={getPopupContainer} getTargetContainer={getTargetContainer}>
+        <ConfigProvider getPopupContainer={getPopupContainer} getTargetContainer={getTargetContainer}>
           {children}
-        </Configure>
+        </ConfigProvider>
       </div>
     </Drawer>
   );
diff --git a/Assets/js/components/FlexLayout/index.tsx b/Assets/js/components/FlexLayout/index.tsx
index dd10e0ed..5846bd89 100644
--- a/Assets/js/components/FlexLayout/index.tsx
+++ b/Assets/js/components/FlexLayout/index.tsx
@@ -2,10 +2,9 @@ import './index.less';
 
 import React, { memo, Suspense, useCallback, useRef, useState } from 'react';
 
-import { Layout } from 'antd';
 import useMedia from '/js/hooks/useMedia';
 import useStorage from '/js/hooks/useStorage';
-import Configure from '/js/components/Configure';
+import { ConfigProvider, Layout } from 'antd';
 import RouteBreadcrumb from '/js/components/RouteBreadcrumb';
 import SuspenseFallBack from '/js/components/SuspenseFallBack';
 import { MenuFoldOutlined, MenuUnfoldOutlined } from '@ant-design/icons';
@@ -135,10 +134,10 @@ export default memo(function FlexLayout(props: FlexLayoutProps): React.ReactElem
         </Header>
         <Content>
           <div ref={contentRef} className={`${prefixUI}-content`}>
-            <Configure getPopupContainer={getPopupContainer} getTargetContainer={getTargetContainer}>
+            <ConfigProvider getPopupContainer={getPopupContainer} getTargetContainer={getTargetContainer}>
               <RouteBreadcrumb />
               <Suspense fallback={<SuspenseFallBack />}>{children}</Suspense>
-            </Configure>
+            </ConfigProvider>
           </div>
         </Content>
       </Layout>