diff --git a/components/calendar/demo/basic.md b/components/calendar/demo/basic.md
index d5708d2614..82583bcc07 100644
--- a/components/calendar/demo/basic.md
+++ b/components/calendar/demo/basic.md
@@ -15,7 +15,7 @@ A basic calendar component with Year/Month switch.
 
 ```tsx
 import { Calendar } from 'antd';
-import type { CalendarMode } from 'antd/lib/calendar/generateCalendar';
+import type { CalendarMode } from 'antd/es/calendar/generateCalendar';
 import type { Moment } from 'moment';
 import React from 'react';
 
diff --git a/components/calendar/demo/card.md b/components/calendar/demo/card.md
index 0f886ab863..e31880d1b0 100644
--- a/components/calendar/demo/card.md
+++ b/components/calendar/demo/card.md
@@ -15,7 +15,7 @@ Nested inside a container element for rendering in limited space.
 
 ```tsx
 import { Calendar } from 'antd';
-import type { CalendarMode } from 'antd/lib/calendar/generateCalendar';
+import type { CalendarMode } from 'antd/es/calendar/generateCalendar';
 import type { Moment } from 'moment';
 import React from 'react';
 
diff --git a/components/calendar/demo/customize-header.md b/components/calendar/demo/customize-header.md
index 7f5a2c51ba..969d40efc5 100644
--- a/components/calendar/demo/customize-header.md
+++ b/components/calendar/demo/customize-header.md
@@ -15,7 +15,7 @@ Customize Calendar header content.
 
 ```tsx
 import { Calendar, Col, Radio, Row, Select, Typography } from 'antd';
-import type { CalendarMode } from 'antd/lib/calendar/generateCalendar';
+import type { CalendarMode } from 'antd/es/calendar/generateCalendar';
 import type { Moment } from 'moment';
 import React from 'react';
 
diff --git a/components/carousel/demo/position.md b/components/carousel/demo/position.md
index 059304f331..0e3eaa8185 100644
--- a/components/carousel/demo/position.md
+++ b/components/carousel/demo/position.md
@@ -16,7 +16,7 @@ There are 4 position options available.
 ```tsx
 import type { RadioChangeEvent } from 'antd';
 import { Carousel, Radio } from 'antd';
-import type { DotPosition } from 'antd/lib/carousel';
+import type { DotPosition } from 'antd/es/carousel';
 import React, { useState } from 'react';
 
 const contentStyle: React.CSSProperties = {
diff --git a/components/config-provider/demo/direction.md b/components/config-provider/demo/direction.md
index 709fddaaf7..6b9fcd79d4 100644
--- a/components/config-provider/demo/direction.md
+++ b/components/config-provider/demo/direction.md
@@ -44,7 +44,7 @@ import {
   Tree,
   TreeSelect,
 } from 'antd';
-import type { DirectionType } from 'antd/lib/config-provider';
+import type { DirectionType } from 'antd/es/config-provider';
 import React, { useState } from 'react';
 
 const InputGroup = Input.Group;
diff --git a/components/config-provider/demo/locale.md b/components/config-provider/demo/locale.md
index c8e2d5626c..8bd720d01e 100644
--- a/components/config-provider/demo/locale.md
+++ b/components/config-provider/demo/locale.md
@@ -29,8 +29,8 @@ import {
   TimePicker,
   Transfer,
 } from 'antd';
-import enUS from 'antd/lib/locale/en_US';
-import zhCN from 'antd/lib/locale/zh_CN';
+import enUS from 'antd/es/locale/en_US';
+import zhCN from 'antd/es/locale/zh_CN';
 import moment from 'moment';
 import 'moment/locale/zh-cn';
 import React, { useState } from 'react';
diff --git a/components/config-provider/demo/size.md b/components/config-provider/demo/size.md
index 3979eddf96..4f2120bdc7 100644
--- a/components/config-provider/demo/size.md
+++ b/components/config-provider/demo/size.md
@@ -26,7 +26,7 @@ import {
   Table,
   Tabs,
 } from 'antd';
-import type { SizeType } from 'antd/lib/config-provider/SizeContext';
+import type { SizeType } from 'antd/es/config-provider/SizeContext';
 import React, { useState } from 'react';
 
 const { TabPane } = Tabs;
diff --git a/components/config-provider/index.en-US.md b/components/config-provider/index.en-US.md
index 3650643b3b..aeb57892c9 100644
--- a/components/config-provider/index.en-US.md
+++ b/components/config-provider/index.en-US.md
@@ -49,7 +49,7 @@ Some components use dynamic style to support wave effect. You can config `csp` p
 | getTargetContainer | Config Affix, Anchor scroll target container | () => HTMLElement | () => window | 4.2.0 |
 | iconPrefixCls | Set icon prefix className (cooperated with [@iconfont-css-prefix](https://github.com/ant-design/ant-design/blob/d943b85a523bdf181dabc12c928226f3b4b893de/components/style/themes/default.less#L106)) | string | `anticon` | 4.11.0 |
 | input | Set Input common props | { autoComplete?: string } | - | 4.2.0 |
-| locale | Language package setting, you can find the packages in [antd/lib/locale](http://unpkg.com/antd/lib/locale/) | object | - |  |
+| locale | Language package setting, you can find the packages in [antd/es/locale](http://unpkg.com/antd/es/locale/) | object | - |  |
 | pageHeader | Unify the ghost of PageHeader, ref [PageHeader](/components/page-header) | { ghost: boolean } | true |  |
 | prefixCls | Set prefix className (cooperated with [@ant-prefix](https://github.com/ant-design/ant-design/blob/2c6c789e3a9356f96c47aea0083f5a15538315cf/components/style/themes/default.less#L7)) | string | `ant` |  |
 | renderEmpty | Set empty content of components. Ref [Empty](/components/empty/) | function(componentName: string): ReactNode | - |  |
diff --git a/components/config-provider/index.zh-CN.md b/components/config-provider/index.zh-CN.md
index 7f6ea0b1a2..f8f18faaa6 100644
--- a/components/config-provider/index.zh-CN.md
+++ b/components/config-provider/index.zh-CN.md
@@ -50,7 +50,7 @@ export default () => (
 | getTargetContainer | 配置 Affix、Anchor 滚动监听容器。 | () => HTMLElement | () => window | 4.2.0 |
 | iconPrefixCls | 设置图标统一样式前缀。注意：需要配合 `less` 变量 [@iconfont-css-prefix](https://github.com/ant-design/ant-design/blob/d943b85a523bdf181dabc12c928226f3b4b893de/components/style/themes/default.less#L106) 使用 | string | `anticon` | 4.11.0 |
 | input | 设置 Input 组件的通用属性 | { autoComplete?: string } | - | 4.2.0 |
-| locale | 语言包配置，语言包可到 [antd/lib/locale](http://unpkg.com/antd/lib/locale/) 目录下寻找 | object | - |  |
+| locale | 语言包配置，语言包可到 [antd/es/locale](http://unpkg.com/antd/es/locale/) 目录下寻找 | object | - |  |
 | pageHeader | 统一设置 PageHeader 的 ghost，参考 [PageHeader](/components/page-header) | { ghost: boolean } | true |  |
 | prefixCls | 设置统一样式前缀。注意：需要配合 `less` 变量 [@ant-prefix](https://github.com/ant-design/ant-design/blob/2c6c789e3a9356f96c47aea0083f5a15538315cf/components/style/themes/default.less#L7) 使用 | string | `ant` |  |
 | renderEmpty | 自定义组件空状态。参考 [空状态](/components/empty/) | function(componentName: string): ReactNode | - |  |
diff --git a/components/date-picker/index.en-US.md b/components/date-picker/index.en-US.md
index 48e299d6b9..dde529e66e 100644
--- a/components/date-picker/index.en-US.md
+++ b/components/date-picker/index.en-US.md
@@ -39,7 +39,7 @@ import locale from 'antd/es/date-picker/locale/zh_CN';
 // The default locale is en-US, if you want to use other locale, just set locale in entry file globally.
 import moment from 'moment';
 import 'moment/locale/zh-cn';
-import locale from 'antd/lib/locale/zh_CN';
+import locale from 'antd/es/locale/zh_CN';
 
 <ConfigProvider locale={locale}>
   <DatePicker defaultValue={moment('2015-01-01', 'YYYY-MM-DD')} />
diff --git a/components/date-picker/index.zh-CN.md b/components/date-picker/index.zh-CN.md
index 3e718c202c..a3c7fcef09 100644
--- a/components/date-picker/index.zh-CN.md
+++ b/components/date-picker/index.zh-CN.md
@@ -40,7 +40,7 @@ import locale from 'antd/es/date-picker/locale/zh_CN';
 // 默认语言为 en-US，如果你需要设置其他语言，推荐在入口文件全局设置 locale
 import moment from 'moment';
 import 'moment/locale/zh-cn';
-import locale from 'antd/lib/locale/zh_CN';
+import locale from 'antd/es/locale/zh_CN';
 
 <ConfigProvider locale={locale}>
   <DatePicker defaultValue={moment('2015-01-01', 'YYYY-MM-DD')} />
diff --git a/components/notification/demo/hooks.md b/components/notification/demo/hooks.md
index 299defdcc7..46c2c7e550 100755
--- a/components/notification/demo/hooks.md
+++ b/components/notification/demo/hooks.md
@@ -21,7 +21,7 @@ import {
   RadiusUprightOutlined,
 } from '@ant-design/icons';
 import { Button, Divider, notification, Space } from 'antd';
-import type { NotificationPlacement } from 'antd/lib/notification';
+import type { NotificationPlacement } from 'antd/es/notification';
 import React from 'react';
 
 const Context = React.createContext({ name: 'Default' });
diff --git a/components/notification/demo/placement.md b/components/notification/demo/placement.md
index 13072dd922..e398be29f1 100755
--- a/components/notification/demo/placement.md
+++ b/components/notification/demo/placement.md
@@ -23,7 +23,7 @@ import {
   RadiusUprightOutlined,
 } from '@ant-design/icons';
 import { Button, Divider, notification, Space } from 'antd';
-import type { NotificationPlacement } from 'antd/lib/notification';
+import type { NotificationPlacement } from 'antd/es/notification';
 import React from 'react';
 
 const openNotification = (placement: NotificationPlacement) => {
diff --git a/components/slider/demo/mark.md b/components/slider/demo/mark.md
index 7801f6f3c7..66eb94404e 100644
--- a/components/slider/demo/mark.md
+++ b/components/slider/demo/mark.md
@@ -15,7 +15,7 @@ Using `marks` property to mark a graduated slider, use `value` or `defaultValue`
 
 ```tsx
 import { Slider } from 'antd';
-import type { SliderMarks } from 'antd/lib/slider';
+import type { SliderMarks } from 'antd/es/slider';
 import React from 'react';
 
 const marks: SliderMarks = {
diff --git a/components/slider/demo/vertical.md b/components/slider/demo/vertical.md
index 5b30b1ce41..51fa5a7e59 100644
--- a/components/slider/demo/vertical.md
+++ b/components/slider/demo/vertical.md
@@ -15,7 +15,7 @@ The vertical Slider.
 
 ```tsx
 import { Slider } from 'antd';
-import type { SliderMarks } from 'antd/lib/slider';
+import type { SliderMarks } from 'antd/es/slider';
 import React from 'react';
 
 const style: React.CSSProperties = {
diff --git a/components/statistic/demo/countdown.md b/components/statistic/demo/countdown.md
index bde614ea3d..eb2322f05f 100644
--- a/components/statistic/demo/countdown.md
+++ b/components/statistic/demo/countdown.md
@@ -15,7 +15,7 @@ Countdown component.
 
 ```tsx
 import { Col, Row, Statistic } from 'antd';
-import type { countdownValueType } from 'antd/lib/statistic/utils';
+import type { countdownValueType } from 'antd/es/statistic/utils';
 import React from 'react';
 
 const { Countdown } = Statistic;
diff --git a/components/table/demo/ajax.md b/components/table/demo/ajax.md
index fbdea74c1d..6e07e56920 100644
--- a/components/table/demo/ajax.md
+++ b/components/table/demo/ajax.md
@@ -27,8 +27,8 @@ Setting `rowSelection.preserveSelectedRowKeys` to keep the `key` when enable sel
 
 ```tsx
 import { Table } from 'antd';
-import type { ColumnsType, TablePaginationConfig } from 'antd/lib/table';
-import type { FilterValue, SorterResult } from 'antd/lib/table/interface';
+import type { ColumnsType, TablePaginationConfig } from 'antd/es/table';
+import type { FilterValue, SorterResult } from 'antd/es/table/interface';
 import qs from 'qs';
 import React, { useEffect, useState } from 'react';
 
diff --git a/components/table/demo/basic.md b/components/table/demo/basic.md
index 0d991b37fe..13821aaf70 100644
--- a/components/table/demo/basic.md
+++ b/components/table/demo/basic.md
@@ -15,7 +15,7 @@ Simple table with actions.
 
 ```tsx
 import { Space, Table, Tag } from 'antd';
-import type { ColumnsType } from 'antd/lib/table';
+import type { ColumnsType } from 'antd/es/table';
 import React from 'react';
 
 interface DataType {
diff --git a/components/table/demo/bordered.md b/components/table/demo/bordered.md
index 0e3f4309b5..1771bf6651 100644
--- a/components/table/demo/bordered.md
+++ b/components/table/demo/bordered.md
@@ -15,7 +15,7 @@ Add border, title and footer for table.
 
 ```tsx
 import { Table } from 'antd';
-import type { ColumnsType } from 'antd/lib/table';
+import type { ColumnsType } from 'antd/es/table';
 import React from 'react';
 
 interface DataType {
diff --git a/components/table/demo/colspan-rowspan.md b/components/table/demo/colspan-rowspan.md
index dc436d259a..cfe669aac2 100644
--- a/components/table/demo/colspan-rowspan.md
+++ b/components/table/demo/colspan-rowspan.md
@@ -20,7 +20,7 @@ Table cell supports `colSpan` and `rowSpan` that set in render return object. Wh
 
 ```tsx
 import { Table } from 'antd';
-import type { ColumnsType } from 'antd/lib/table';
+import type { ColumnsType } from 'antd/es/table';
 import React from 'react';
 
 interface DataType {
diff --git a/components/table/demo/custom-filter-panel.md b/components/table/demo/custom-filter-panel.md
index 626d8d4047..a1fb312bf2 100644
--- a/components/table/demo/custom-filter-panel.md
+++ b/components/table/demo/custom-filter-panel.md
@@ -21,8 +21,8 @@ Add the `boolean` type parameter `closeDropdown` to the function `clearFilters`.
 import { SearchOutlined } from '@ant-design/icons';
 import type { InputRef } from 'antd';
 import { Button, Input, Space, Table } from 'antd';
-import type { ColumnsType, ColumnType } from 'antd/lib/table';
-import type { FilterConfirmProps } from 'antd/lib/table/interface';
+import type { ColumnsType, ColumnType } from 'antd/es/table';
+import type { FilterConfirmProps } from 'antd/es/table/interface';
 import React, { useRef, useState } from 'react';
 import Highlighter from 'react-highlight-words';
 
diff --git a/components/table/demo/drag-sorting-handler.md b/components/table/demo/drag-sorting-handler.md
index 912e63aa28..1a30bfd521 100644
--- a/components/table/demo/drag-sorting-handler.md
+++ b/components/table/demo/drag-sorting-handler.md
@@ -16,7 +16,7 @@ Alternatively you can implement drag sorting with handler using [react-sortable-
 ```tsx
 import { MenuOutlined } from '@ant-design/icons';
 import { Table } from 'antd';
-import type { ColumnsType } from 'antd/lib/table';
+import type { ColumnsType } from 'antd/es/table';
 import { arrayMoveImmutable } from 'array-move';
 import React, { useState } from 'react';
 import type { SortableContainerProps, SortEnd } from 'react-sortable-hoc';
diff --git a/components/table/demo/drag-sorting.md b/components/table/demo/drag-sorting.md
index 22e3e0e4a0..f34e2564d0 100644
--- a/components/table/demo/drag-sorting.md
+++ b/components/table/demo/drag-sorting.md
@@ -15,7 +15,7 @@ By using `components`, we can integrate table with [react-dnd](https://github.co
 
 ```tsx
 import { Table } from 'antd';
-import type { ColumnsType } from 'antd/lib/table';
+import type { ColumnsType } from 'antd/es/table';
 import update from 'immutability-helper';
 import React, { useCallback, useRef, useState } from 'react';
 import { DndProvider, useDrag, useDrop } from 'react-dnd';
diff --git a/components/table/demo/dynamic-settings.md b/components/table/demo/dynamic-settings.md
index acbf559984..db6bf211e3 100644
--- a/components/table/demo/dynamic-settings.md
+++ b/components/table/demo/dynamic-settings.md
@@ -17,9 +17,9 @@ Select different settings to see the result.
 import { DownOutlined } from '@ant-design/icons';
 import type { RadioChangeEvent } from 'antd';
 import { Form, Radio, Space, Switch, Table } from 'antd';
-import type { SizeType } from 'antd/lib/config-provider/SizeContext';
-import type { ColumnsType, TableProps } from 'antd/lib/table';
-import type { ExpandableConfig, TableRowSelection } from 'antd/lib/table/interface';
+import type { SizeType } from 'antd/es/config-provider/SizeContext';
+import type { ColumnsType, TableProps } from 'antd/es/table';
+import type { ExpandableConfig, TableRowSelection } from 'antd/es/table/interface';
 import React, { useState } from 'react';
 
 interface DataType {
diff --git a/components/table/demo/edit-cell.md b/components/table/demo/edit-cell.md
index b993344a45..637677e56f 100644
--- a/components/table/demo/edit-cell.md
+++ b/components/table/demo/edit-cell.md
@@ -16,7 +16,7 @@ Table with editable cells. When work with `shouldCellUpdate`, please take care o
 ```tsx
 import type { InputRef } from 'antd';
 import { Button, Form, Input, Popconfirm, Table } from 'antd';
-import type { FormInstance } from 'antd/lib/form';
+import type { FormInstance } from 'antd/es/form';
 import React, { useContext, useEffect, useRef, useState } from 'react';
 
 const EditableContext = React.createContext<FormInstance<any> | null>(null);
diff --git a/components/table/demo/ellipsis-custom-tooltip.md b/components/table/demo/ellipsis-custom-tooltip.md
index c8cecbfd4b..25ea1f2f54 100644
--- a/components/table/demo/ellipsis-custom-tooltip.md
+++ b/components/table/demo/ellipsis-custom-tooltip.md
@@ -15,7 +15,7 @@ Ellipsis cell content via setting `column.ellipsis.showTitle`, use `Tooltip` ins
 
 ```tsx
 import { Table, Tooltip } from 'antd';
-import type { ColumnsType } from 'antd/lib/table';
+import type { ColumnsType } from 'antd/es/table';
 import React from 'react';
 
 interface DataType {
diff --git a/components/table/demo/ellipsis.md b/components/table/demo/ellipsis.md
index d9c41f4bab..6e9453b64a 100644
--- a/components/table/demo/ellipsis.md
+++ b/components/table/demo/ellipsis.md
@@ -19,7 +19,7 @@ Ellipsis cell content via setting `column.ellipsis`.
 
 ```tsx
 import { Table } from 'antd';
-import type { ColumnsType } from 'antd/lib/table';
+import type { ColumnsType } from 'antd/es/table';
 import React from 'react';
 
 interface DataType {
diff --git a/components/table/demo/expand.md b/components/table/demo/expand.md
index 7ec7883860..40c1aaedde 100644
--- a/components/table/demo/expand.md
+++ b/components/table/demo/expand.md
@@ -15,7 +15,7 @@ When there's too much information to show and the table can't display all at onc
 
 ```tsx
 import { Table } from 'antd';
-import type { ColumnsType } from 'antd/lib/table';
+import type { ColumnsType } from 'antd/es/table';
 import React from 'react';
 
 interface DataType {
diff --git a/components/table/demo/filter-in-tree.md b/components/table/demo/filter-in-tree.md
index 19534f3f4d..5760ed533a 100644
--- a/components/table/demo/filter-in-tree.md
+++ b/components/table/demo/filter-in-tree.md
@@ -18,7 +18,7 @@ You can use `filterMode` to change default filter interface, options: `menu`(def
 
 ```tsx
 import { Table } from 'antd';
-import type { ColumnsType, TableProps } from 'antd/lib/table';
+import type { ColumnsType, TableProps } from 'antd/es/table';
 import React from 'react';
 
 interface DataType {
diff --git a/components/table/demo/filter-search.md b/components/table/demo/filter-search.md
index 390f163f80..9cf6408902 100644
--- a/components/table/demo/filter-search.md
+++ b/components/table/demo/filter-search.md
@@ -16,7 +16,7 @@ title:
 
 ```tsx
 import { Table } from 'antd';
-import type { ColumnsType, TableProps } from 'antd/lib/table';
+import type { ColumnsType, TableProps } from 'antd/es/table';
 import React from 'react';
 
 interface DataType {
diff --git a/components/table/demo/fixed-columns-header.md b/components/table/demo/fixed-columns-header.md
index 439fcf4c07..f9d79a34db 100644
--- a/components/table/demo/fixed-columns-header.md
+++ b/components/table/demo/fixed-columns-header.md
@@ -23,7 +23,7 @@ A Solution for displaying large amounts of data with long columns.
 
 ```tsx
 import { Table } from 'antd';
-import type { ColumnsType } from 'antd/lib/table';
+import type { ColumnsType } from 'antd/es/table';
 import React from 'react';
 
 interface DataType {
diff --git a/components/table/demo/fixed-columns.md b/components/table/demo/fixed-columns.md
index 82bc556df0..d44994aead 100644
--- a/components/table/demo/fixed-columns.md
+++ b/components/table/demo/fixed-columns.md
@@ -27,7 +27,7 @@ To fix some columns and scroll inside other columns, and you must set `scroll.x`
 
 ```tsx
 import { Table } from 'antd';
-import type { ColumnsType } from 'antd/lib/table';
+import type { ColumnsType } from 'antd/es/table';
 import React from 'react';
 
 interface DataType {
diff --git a/components/table/demo/fixed-header.md b/components/table/demo/fixed-header.md
index 9d15e7d8bb..3a1062f9b8 100644
--- a/components/table/demo/fixed-header.md
+++ b/components/table/demo/fixed-header.md
@@ -19,7 +19,7 @@ Display large amounts of data in scrollable view.
 
 ```tsx
 import { Table } from 'antd';
-import type { ColumnsType } from 'antd/lib/table';
+import type { ColumnsType } from 'antd/es/table';
 import React from 'react';
 
 interface DataType {
diff --git a/components/table/demo/grouping-columns.md b/components/table/demo/grouping-columns.md
index 44c1ef7f0d..facf8a4883 100644
--- a/components/table/demo/grouping-columns.md
+++ b/components/table/demo/grouping-columns.md
@@ -15,7 +15,7 @@ Group table head with `columns[n].children`.
 
 ```tsx
 import { Table } from 'antd';
-import type { ColumnsType } from 'antd/lib/table';
+import type { ColumnsType } from 'antd/es/table';
 import React from 'react';
 
 interface DataType {
diff --git a/components/table/demo/head.md b/components/table/demo/head.md
index a914abaed7..b8bcbe36e2 100644
--- a/components/table/demo/head.md
+++ b/components/table/demo/head.md
@@ -31,7 +31,7 @@ If a `sortOrder` or `defaultSortOrder` is specified with the value `ascend` or `
 
 ```tsx
 import { Table } from 'antd';
-import type { ColumnsType, TableProps } from 'antd/lib/table';
+import type { ColumnsType, TableProps } from 'antd/es/table';
 import React from 'react';
 
 interface DataType {
diff --git a/components/table/demo/multiple-sorter.md b/components/table/demo/multiple-sorter.md
index 7ec614a162..37bc9393f6 100644
--- a/components/table/demo/multiple-sorter.md
+++ b/components/table/demo/multiple-sorter.md
@@ -15,7 +15,7 @@ title:
 
 ```tsx
 import { Table } from 'antd';
-import type { ColumnsType, TableProps } from 'antd/lib/table';
+import type { ColumnsType, TableProps } from 'antd/es/table';
 import React from 'react';
 
 interface DataType {
diff --git a/components/table/demo/narrow.md b/components/table/demo/narrow.md
index 09b37e4596..78f888e002 100644
--- a/components/table/demo/narrow.md
+++ b/components/table/demo/narrow.md
@@ -16,7 +16,7 @@ There are two compacted table sizes: `middle` and `small`. The `small` size is u
 
 ```tsx
 import { Table } from 'antd';
-import type { ColumnsType } from 'antd/lib/table';
+import type { ColumnsType } from 'antd/es/table';
 import React from 'react';
 
 interface DataType {
diff --git a/components/table/demo/order-column.md b/components/table/demo/order-column.md
index 8d3321ae72..0ed7923b27 100644
--- a/components/table/demo/order-column.md
+++ b/components/table/demo/order-column.md
@@ -16,7 +16,7 @@ You can control the order of the expand and select columns by using `Table.EXPAN
 
 ```tsx
 import { Table } from 'antd';
-import type { ColumnsType } from 'antd/lib/table';
+import type { ColumnsType } from 'antd/es/table';
 import React from 'react';
 
 interface DataType {
diff --git a/components/table/demo/pagination.md b/components/table/demo/pagination.md
index 117b8f45f2..90aa77605a 100644
--- a/components/table/demo/pagination.md
+++ b/components/table/demo/pagination.md
@@ -15,7 +15,7 @@ Table pagination settings.
 
 ```tsx
 import { Radio, Space, Table, Tag } from 'antd';
-import type { ColumnsType } from 'antd/lib/table';
+import type { ColumnsType } from 'antd/es/table';
 import React, { useState } from 'react';
 
 interface DataType {
diff --git a/components/table/demo/reset-filter.md b/components/table/demo/reset-filter.md
index 2a2212563e..69899bfb93 100644
--- a/components/table/demo/reset-filter.md
+++ b/components/table/demo/reset-filter.md
@@ -24,7 +24,7 @@ Control filters and sorters by `filteredValue` and `sortOrder`.
 ```tsx
 import type { TableProps } from 'antd';
 import { Button, Space, Table } from 'antd';
-import type { ColumnsType, FilterValue, SorterResult } from 'antd/lib/table/interface';
+import type { ColumnsType, FilterValue, SorterResult } from 'antd/es/table/interface';
 import React, { useState } from 'react';
 
 interface DataType {
diff --git a/components/table/demo/resizable-column.md b/components/table/demo/resizable-column.md
index b9d4e27312..46f01d69a1 100644
--- a/components/table/demo/resizable-column.md
+++ b/components/table/demo/resizable-column.md
@@ -16,7 +16,7 @@ Implement resizable column by integrate with [react-resizable](https://github.co
 
 ```tsx
 import { Table } from 'antd';
-import type { ColumnsType, ColumnType } from 'antd/lib/table';
+import type { ColumnsType, ColumnType } from 'antd/es/table';
 import React, { useState } from 'react';
 import type { ResizeCallbackData } from 'react-resizable';
 import { Resizable } from 'react-resizable';
diff --git a/components/table/demo/responsive.md b/components/table/demo/responsive.md
index 70496e3370..8a5f90e794 100644
--- a/components/table/demo/responsive.md
+++ b/components/table/demo/responsive.md
@@ -15,7 +15,7 @@ Responsive columns.
 
 ```tsx
 import { Table } from 'antd';
-import type { ColumnsType } from 'antd/lib/table';
+import type { ColumnsType } from 'antd/es/table';
 import React from 'react';
 
 interface DataType {
diff --git a/components/table/demo/row-selection-and-operation.md b/components/table/demo/row-selection-and-operation.md
index d14980e111..2af2706106 100644
--- a/components/table/demo/row-selection-and-operation.md
+++ b/components/table/demo/row-selection-and-operation.md
@@ -15,7 +15,7 @@ To perform operations and clear selections after selecting some rows, use `rowSe
 
 ```tsx
 import { Button, Table } from 'antd';
-import type { ColumnsType } from 'antd/lib/table';
+import type { ColumnsType } from 'antd/es/table';
 import React, { useState } from 'react';
 
 interface DataType {
diff --git a/components/table/demo/row-selection-custom-debug.md b/components/table/demo/row-selection-custom-debug.md
index 9df24a1f1f..82a4094848 100644
--- a/components/table/demo/row-selection-custom-debug.md
+++ b/components/table/demo/row-selection-custom-debug.md
@@ -16,8 +16,8 @@ Customize selection group.
 
 ```tsx
 import { Table } from 'antd';
-import type { ColumnsType } from 'antd/lib/table';
-import type { TableRowSelection } from 'antd/lib/table/interface';
+import type { ColumnsType } from 'antd/es/table';
+import type { TableRowSelection } from 'antd/es/table/interface';
 import React from 'react';
 
 interface DataType {
diff --git a/components/table/demo/row-selection-custom.md b/components/table/demo/row-selection-custom.md
index eb932ec09e..ee71f4973e 100644
--- a/components/table/demo/row-selection-custom.md
+++ b/components/table/demo/row-selection-custom.md
@@ -15,8 +15,8 @@ Use `rowSelection.selections` custom selections, default no select dropdown, sho
 
 ```tsx
 import { Table } from 'antd';
-import type { ColumnsType } from 'antd/lib/table';
-import type { TableRowSelection } from 'antd/lib/table/interface';
+import type { ColumnsType } from 'antd/es/table';
+import type { TableRowSelection } from 'antd/es/table/interface';
 import React, { useState } from 'react';
 
 interface DataType {
diff --git a/components/table/demo/row-selection.md b/components/table/demo/row-selection.md
index d7a4004b16..0e02dd7f65 100644
--- a/components/table/demo/row-selection.md
+++ b/components/table/demo/row-selection.md
@@ -19,7 +19,7 @@ Rows can be selectable by making first column as a selectable column. You can us
 
 ```tsx
 import { Divider, Radio, Table } from 'antd';
-import type { ColumnsType } from 'antd/lib/table';
+import type { ColumnsType } from 'antd/es/table';
 import React, { useState } from 'react';
 
 interface DataType {
diff --git a/components/table/demo/size.md b/components/table/demo/size.md
index 77873ee086..ad972dcb84 100644
--- a/components/table/demo/size.md
+++ b/components/table/demo/size.md
@@ -15,7 +15,7 @@ There are two compacted table sizes: `middle` and `small`. The `small` size is u
 
 ```tsx
 import { Table } from 'antd';
-import type { ColumnsType } from 'antd/lib/table';
+import type { ColumnsType } from 'antd/es/table';
 import React from 'react';
 
 interface DataType {
diff --git a/components/table/demo/sticky.md b/components/table/demo/sticky.md
index 99ccb43d5b..d3893c0153 100644
--- a/components/table/demo/sticky.md
+++ b/components/table/demo/sticky.md
@@ -15,7 +15,7 @@ For long table，need to scroll to view the header and scroll bar，then you can
 
 ```tsx
 import { Switch, Table } from 'antd';
-import type { ColumnsType } from 'antd/lib/table';
+import type { ColumnsType } from 'antd/es/table';
 import React, { useState } from 'react';
 
 interface DataType {
diff --git a/components/table/demo/summary.md b/components/table/demo/summary.md
index 39287efa24..e8d4caa0a8 100644
--- a/components/table/demo/summary.md
+++ b/components/table/demo/summary.md
@@ -15,7 +15,7 @@ Set summary content by `summary` prop. Sync column fixed status with `Table.Summ
 
 ```tsx
 import { Table, Typography } from 'antd';
-import type { ColumnsType } from 'antd/lib/table';
+import type { ColumnsType } from 'antd/es/table';
 import React from 'react';
 
 const { Text } = Typography;
diff --git a/components/table/demo/tree-data.md b/components/table/demo/tree-data.md
index a0d9fd22e1..3b305d5484 100644
--- a/components/table/demo/tree-data.md
+++ b/components/table/demo/tree-data.md
@@ -19,8 +19,8 @@ You can control the indent width by setting `indentSize`.
 
 ```tsx
 import { Space, Switch, Table } from 'antd';
-import type { ColumnsType } from 'antd/lib/table';
-import type { TableRowSelection } from 'antd/lib/table/interface';
+import type { ColumnsType } from 'antd/es/table';
+import type { TableRowSelection } from 'antd/es/table/interface';
 import React, { useState } from 'react';
 
 interface DataType {
diff --git a/components/tabs/demo/size.md b/components/tabs/demo/size.md
index f512315ab5..911530b677 100644
--- a/components/tabs/demo/size.md
+++ b/components/tabs/demo/size.md
@@ -16,7 +16,7 @@ Large size tabs are usually used in page header, and small size could be used in
 ```tsx
 import type { RadioChangeEvent } from 'antd';
 import { Radio, Tabs } from 'antd';
-import type { SizeType } from 'antd/lib/config-provider/SizeContext';
+import type { SizeType } from 'antd/es/config-provider/SizeContext';
 import React, { useState } from 'react';
 
 const { TabPane } = Tabs;
diff --git a/components/tree/demo/basic-controlled.md b/components/tree/demo/basic-controlled.md
index e208aa879f..2a55cbef6c 100644
--- a/components/tree/demo/basic-controlled.md
+++ b/components/tree/demo/basic-controlled.md
@@ -15,7 +15,7 @@ Controlled mode lets parent nodes reflect the status of child nodes more intelli
 
 ```tsx
 import { Tree } from 'antd';
-import type { DataNode } from 'antd/lib/tree';
+import type { DataNode } from 'antd/es/tree';
 import React, { useState } from 'react';
 
 const treeData: DataNode[] = [
diff --git a/components/tree/demo/basic.md b/components/tree/demo/basic.md
index 16a4fc723c..af5069d3e2 100644
--- a/components/tree/demo/basic.md
+++ b/components/tree/demo/basic.md
@@ -15,7 +15,7 @@ The most basic usage, tell you how to use checkable, selectable, disabled, defau
 
 ```tsx
 import { Tree } from 'antd';
-import type { DataNode, TreeProps } from 'antd/lib/tree';
+import type { DataNode, TreeProps } from 'antd/es/tree';
 import React from 'react';
 
 const treeData: DataNode[] = [
diff --git a/components/tree/demo/big-data.md b/components/tree/demo/big-data.md
index 4c2579c478..16f41ad6ac 100644
--- a/components/tree/demo/big-data.md
+++ b/components/tree/demo/big-data.md
@@ -16,7 +16,7 @@ Plenty of tree nodes.
 
 ```tsx
 import { Tree } from 'antd';
-import type { DataNode } from 'antd/lib/tree';
+import type { DataNode } from 'antd/es/tree';
 import React from 'react';
 
 const treeData: DataNode[] = [];
diff --git a/components/tree/demo/customized-icon.md b/components/tree/demo/customized-icon.md
index eb67413ba6..d8d3facb47 100644
--- a/components/tree/demo/customized-icon.md
+++ b/components/tree/demo/customized-icon.md
@@ -22,7 +22,7 @@ import {
   SmileOutlined,
 } from '@ant-design/icons';
 import { Tree } from 'antd';
-import type { DataNode } from 'antd/lib/tree';
+import type { DataNode } from 'antd/es/tree';
 import React from 'react';
 
 const treeData: DataNode[] = [
diff --git a/components/tree/demo/directory.md b/components/tree/demo/directory.md
index 918fe995e1..7324e973b8 100644
--- a/components/tree/demo/directory.md
+++ b/components/tree/demo/directory.md
@@ -15,7 +15,7 @@ Built-in directory tree. `multiple` support `ctrl(Windows)` / `command(Mac)` sel
 
 ```tsx
 import { Tree } from 'antd';
-import type { DataNode, DirectoryTreeProps } from 'antd/lib/tree';
+import type { DataNode, DirectoryTreeProps } from 'antd/es/tree';
 import React from 'react';
 
 const { DirectoryTree } = Tree;
diff --git a/components/tree/demo/draggable.md b/components/tree/demo/draggable.md
index b0a9b673b1..8b3ff08a04 100644
--- a/components/tree/demo/draggable.md
+++ b/components/tree/demo/draggable.md
@@ -15,7 +15,7 @@ Drag treeNode to insert after the other treeNode or insert into the other parent
 
 ```tsx
 import { Tree } from 'antd';
-import type { DataNode, TreeProps } from 'antd/lib/tree';
+import type { DataNode, TreeProps } from 'antd/es/tree';
 import React, { useState } from 'react';
 
 const x = 3;
diff --git a/components/tree/demo/line.md b/components/tree/demo/line.md
index 4f90a5aa51..bb874c43eb 100644
--- a/components/tree/demo/line.md
+++ b/components/tree/demo/line.md
@@ -16,7 +16,7 @@ Tree with connected line between nodes, turn on by `showLine`, customize the pre
 ```tsx
 import { CarryOutOutlined, FormOutlined } from '@ant-design/icons';
 import { Switch, Tree } from 'antd';
-import type { DataNode } from 'antd/lib/tree';
+import type { DataNode } from 'antd/es/tree';
 import React, { useState } from 'react';
 
 const treeData: DataNode[] = [
diff --git a/components/tree/demo/search.md b/components/tree/demo/search.md
index e37a9cf347..7353ef3841 100644
--- a/components/tree/demo/search.md
+++ b/components/tree/demo/search.md
@@ -15,7 +15,7 @@ Searchable Tree.
 
 ```tsx
 import { Input, Tree } from 'antd';
-import type { DataNode } from 'antd/lib/tree';
+import type { DataNode } from 'antd/es/tree';
 import React, { useMemo, useState } from 'react';
 
 const { Search } = Input;
diff --git a/components/tree/demo/switcher-icon.md b/components/tree/demo/switcher-icon.md
index 341dd3ef77..589f41ddbd 100644
--- a/components/tree/demo/switcher-icon.md
+++ b/components/tree/demo/switcher-icon.md
@@ -16,7 +16,7 @@ customize collapse/expand icon of tree node
 ```tsx
 import { DownOutlined } from '@ant-design/icons';
 import { Tree } from 'antd';
-import type { DataNode, TreeProps } from 'antd/lib/tree';
+import type { DataNode, TreeProps } from 'antd/es/tree';
 import React from 'react';
 
 const treeData: DataNode[] = [
diff --git a/components/tree/demo/virtual-scroll.md b/components/tree/demo/virtual-scroll.md
index 4904c296db..913d55a7fb 100644
--- a/components/tree/demo/virtual-scroll.md
+++ b/components/tree/demo/virtual-scroll.md
@@ -15,7 +15,7 @@ Use virtual list through `height` prop.
 
 ```tsx
 import { Tree } from 'antd';
-import type { DataNode } from 'antd/lib/tree';
+import type { DataNode } from 'antd/es/tree';
 import React from 'react';
 
 const dig = (path = '0', level = 3) => {
diff --git a/docs/react/customize-theme.en-US.md b/docs/react/customize-theme.en-US.md
index ab37aff515..f6c82732bb 100644
--- a/docs/react/customize-theme.en-US.md
+++ b/docs/react/customize-theme.en-US.md
@@ -98,7 +98,7 @@ Follow [Use in create-react-app](/docs/react/use-with-create-react-app).
 Another approach to customize theme is creating a `less` file within variables to override `antd.less`.
 
 ```css
-@import '~antd/lib/style/themes/default.less';
+@import '~antd/es/style/themes/default.less';
 @import '~antd/dist/antd.less'; // Import Ant Design styles by less entry
 @import 'your-theme-file.less'; // variables to override above
 ```
@@ -122,7 +122,7 @@ It's possible to configure webpack to load an alternate less file:
 ```ts
 new webpack.NormalModuleReplacementPlugin( /node_modules\/antd\/lib\/style\/index\.less/, path.resolve(rootDir, 'src/myStylesReplacement.less') )
 
-#antd { @import '~antd/lib/style/core/index.less'; @import '~antd/lib/style/themes/default.less'; }
+#antd { @import '~antd/es/style/core/index.less'; @import '~antd/es/style/themes/default.less'; }
 ```
 
 Where the src/myStylesReplacement.less file loads the same files as the index.less file, but loads them within the scope of a top-level selector : the result is that all of the "global" styles are being applied with the #antd scope.
diff --git a/docs/react/customize-theme.zh-CN.md b/docs/react/customize-theme.zh-CN.md
index 7ebca0f1c7..75db5d086a 100644
--- a/docs/react/customize-theme.zh-CN.md
+++ b/docs/react/customize-theme.zh-CN.md
@@ -98,7 +98,7 @@ module.exports = {
 另外一种方式是建立一个单独的 `less` 变量文件，引入这个文件覆盖 `antd.less` 里的变量。
 
 ```css
-@import '~antd/lib/style/themes/default.less';
+@import '~antd/es/style/themes/default.less';
 @import '~antd/dist/antd.less'; // 引入官方提供的 less 样式入口文件
 @import 'your-theme-file.less'; // 用于覆盖上面定义的变量
 ```
diff --git a/docs/react/getting-started.zh-CN.md b/docs/react/getting-started.zh-CN.md
index 2632f34944..5a44da364f 100755
--- a/docs/react/getting-started.zh-CN.md
+++ b/docs/react/getting-started.zh-CN.md
@@ -34,7 +34,7 @@ import React, { useState } from 'react';
 import { render } from 'react-dom';
 import { ConfigProvider, DatePicker, message } from 'antd';
 // 由于 antd 组件的默认文案是英文，所以需要修改为中文
-import zhCN from 'antd/lib/locale/zh_CN';
+import zhCN from 'antd/es/locale/zh_CN';
 import moment from 'moment';
 import 'moment/locale/zh-cn';
 import 'antd/dist/antd.css';
diff --git a/docs/react/i18n.en-US.md b/docs/react/i18n.en-US.md
index 6b4b07e9ce..261af1e009 100644
--- a/docs/react/i18n.en-US.md
+++ b/docs/react/i18n.en-US.md
@@ -11,7 +11,7 @@ The default language of `antd@2.x` is currently English. If you wish to use othe
 
 ```jsx
 import { ConfigProvider } from 'antd';
-import frFR from 'antd/lib/locale/fr_FR';
+import frFR from 'antd/es/locale/fr_FR';
 
 return (
   <ConfigProvider locale={frFR}>
diff --git a/docs/react/i18n.zh-CN.md b/docs/react/i18n.zh-CN.md
index ac32d741b4..8d9b59bb51 100644
--- a/docs/react/i18n.zh-CN.md
+++ b/docs/react/i18n.zh-CN.md
@@ -10,7 +10,7 @@ title: 国际化
 antd 提供了一个 React 组件 [ConfigProvider](/components/config-provider) 用于全局配置国际化文案。
 
 ```jsx
-import zhCN from 'antd/lib/locale/zh_CN';
+import zhCN from 'antd/es/locale/zh_CN';
 
 return (
   <ConfigProvider locale={zhCN}>
diff --git a/docs/spec/colors.en-US.md b/docs/spec/colors.en-US.md
index 9e65ba1d53..1ba123a15d 100644
--- a/docs/spec/colors.en-US.md
+++ b/docs/spec/colors.en-US.md
@@ -59,7 +59,7 @@ We provide Less and JavaScript usage for developers.
 - **Less**
 
   ```less
-  @import '~antd/lib/style/themes/default.less';
+  @import '~antd/es/style/themes/default.less';
 
   .selector {
     color: @blue-5;
diff --git a/docs/spec/colors.zh-CN.md b/docs/spec/colors.zh-CN.md
index 8395d9e677..564e6209d1 100644
--- a/docs/spec/colors.zh-CN.md
+++ b/docs/spec/colors.zh-CN.md
@@ -67,7 +67,7 @@ ReactDOM.render(<ColorPaletteTool />, mountNode);
 - **Less**
 
   ```less
-  @import '~antd/lib/style/themes/default.less';
+  @import '~antd/es/style/themes/default.less';
 
   .selector {
     color: @blue-5;