From 1588cdcad6faa066ae762a4e2c16a965efb37cd5 Mon Sep 17 00:00:00 2001
From: CCherry07 <2405693142@qq.com>
Date: Sun, 25 Aug 2024 12:00:14 +0800
Subject: [PATCH] fix: component path

---
 packages/react-components/package.json        |   2 +-
 .../playground/components.d.ts                | 244 +++++++++---------
 .../react-components/playground/src/index.tsx |   2 +-
 .../react-components/playground/src/test.tsx  |   2 +-
 .../playground/src/types/components.d.ts      | 240 ++++++++---------
 packages/react-components/src/lib.rs          |   5 +-
 6 files changed, 248 insertions(+), 247 deletions(-)

diff --git a/packages/react-components/package.json b/packages/react-components/package.json
index 7e4b861..5c16402 100644
--- a/packages/react-components/package.json
+++ b/packages/react-components/package.json
@@ -51,7 +51,7 @@
   "scripts": {
     "dev": "cargo watch -w src -s 'scripts/watch.sh'",
     "bump": "npx changeset version",
-    "play": "cd playground && farm",
+    "play": "pnpm --filter playground dev",
     "build": "farm-plugin-tools build --platform --cargo-name farmfe_plugin_react_components -p farmfe_plugin_react_components --release",
     "prepublishOnly": "farm-plugin-tools prepublish"
   },
diff --git a/packages/react-components/playground/components.d.ts b/packages/react-components/playground/components.d.ts
index 1359269..1f09bf9 100644
--- a/packages/react-components/playground/components.d.ts
+++ b/packages/react-components/playground/components.d.ts
@@ -1,146 +1,146 @@
 /* generated by farmfe_plugin_react_components */
 export {} 
 declare global {
+	const ComponentX: typeof import('./src/components/ComponentD')['ComponentX']
+	const ComponentE: typeof import('./src/components/ComponentE')['ComponentE']
+	const ComponentD: typeof import('./src/components/ComponentD')['default']
+	const ComponentG: typeof import('./src/components/ComponentE')['ComponentG']
 	const ComponentA: typeof import('./src/components/ComponentA')['default']
 	const ComponentE: typeof import('./src/components/ComponentE')['default']
-	const ComponentB: typeof import('./src/components/ComponentB')['ComponentB']
-	const ComponentF: typeof import('./src/components/ComponentE')['ComponentF']
-	const ComponentE: typeof import('./src/components/ComponentE')['ComponentE']
-	const ComponentX: typeof import('./src/components/ComponentD')['ComponentX']
 	const ComponentC: typeof import('./src/components/ComponentC')['ComponentC']
-	const ComponentG: typeof import('./src/components/ComponentE')['ComponentG']
-	const ComponentD: typeof import('./src/components/ComponentD')['default']
-	const ARadio: typeof import('@arco-design/web-react')['Radio']
-	const AntInput: typeof import('antd')['Input']
-	const AntWatermark: typeof import('antd')['Watermark']
-	const ATransfer: typeof import('@arco-design/web-react')['Transfer']
-	const AntDivider: typeof import('antd')['Divider']
-	const AntRow: typeof import('antd')['Row']
+	const ComponentF: typeof import('./src/components/ComponentE')['ComponentF']
+	const ComponentB: typeof import('./src/components/ComponentB')['ComponentB']
+	const AntSelect: typeof import('antd')['Select']
+	const Antnotification: typeof import('antd')['notification']
+	const AntGrid: typeof import('antd')['Grid']
+	const AntDescriptions: typeof import('antd')['Descriptions']
+	const Anttheme: typeof import('antd')['theme']
+	const AntSpace: typeof import('antd')['Space']
+	const AntTable: typeof import('antd')['Table']
 	const AMenu: typeof import('@arco-design/web-react')['Menu']
-	const AntResult: typeof import('antd')['Result']
-	const AConfigProvider: typeof import('@arco-design/web-react')['ConfigProvider']
+	const ATimeline: typeof import('@arco-design/web-react')['Timeline']
+	const AntAnchor: typeof import('antd')['Anchor']
+	const AMentions: typeof import('@arco-design/web-react')['Mentions']
+	const ANotification: typeof import('@arco-design/web-react')['Notification']
+	const ADrawer: typeof import('@arco-design/web-react')['Drawer']
+	const ASteps: typeof import('@arco-design/web-react')['Steps']
+	const AntButton: typeof import('antd')['Button']
+	const ATag: typeof import('@arco-design/web-react')['Tag']
+	const AntMenu: typeof import('antd')['Menu']
+	const ADescriptions: typeof import('@arco-design/web-react')['Descriptions']
+	const AntWatermark: typeof import('antd')['Watermark']
+	const AResizeBox: typeof import('@arco-design/web-react')['ResizeBox']
+	const ASwitch: typeof import('@arco-design/web-react')['Switch']
+	const ATable: typeof import('@arco-design/web-react')['Table']
+	const AntLayout: typeof import('antd')['Layout']
+	const AntUpload: typeof import('antd')['Upload']
+	const ABreadcrumb: typeof import('@arco-design/web-react')['Breadcrumb']
+	const AntCalendar: typeof import('antd')['Calendar']
+	const AIcon: typeof import('@arco-design/web-react')['Icon']
+	const AntPopover: typeof import('antd')['Popover']
+	const AntForm: typeof import('antd')['Form']
+	const AntBreadcrumb: typeof import('antd')['Breadcrumb']
+	const ABadge: typeof import('@arco-design/web-react')['Badge']
+	const AntSpin: typeof import('antd')['Spin']
+	const ATimePicker: typeof import('@arco-design/web-react')['TimePicker']
+	const AntCard: typeof import('antd')['Card']
+	const AModal: typeof import('@arco-design/web-react')['Modal']
+	const ASlider: typeof import('@arco-design/web-react')['Slider']
+	const AList: typeof import('@arco-design/web-react')['List']
+	const AntSwitch: typeof import('antd')['Switch']
+	const AntTree: typeof import('antd')['Tree']
+	const ACheckbox: typeof import('@arco-design/web-react')['Checkbox']
+	const ADropdown: typeof import('@arco-design/web-react')['Dropdown']
+	const ALink: typeof import('@arco-design/web-react')['Link']
+	const AntBadge: typeof import('antd')['Badge']
+	const AntCheckbox: typeof import('antd')['Checkbox']
+	const ARadio: typeof import('@arco-design/web-react')['Radio']
+	const ADivider: typeof import('@arco-design/web-react')['Divider']
+	const AAffix: typeof import('@arco-design/web-react')['Affix']
+	const AResult: typeof import('@arco-design/web-react')['Result']
 	const AntFlex: typeof import('antd')['Flex']
-	const AInputNumber: typeof import('@arco-design/web-react')['InputNumber']
+	const AntStatistic: typeof import('antd')['Statistic']
+	const AntAlert: typeof import('antd')['Alert']
 	const ACollapse: typeof import('@arco-design/web-react')['Collapse']
-	const AntModal: typeof import('antd')['Modal']
-	const AntTag: typeof import('antd')['Tag']
-	const ALayout: typeof import('@arco-design/web-react')['Layout']
-	const AntForm: typeof import('antd')['Form']
-	const ACalendar: typeof import('@arco-design/web-react')['Calendar']
-	const ATrigger: typeof import('@arco-design/web-react')['Trigger']
-	const ATree: typeof import('@arco-design/web-react')['Tree']
-	const AntSlider: typeof import('antd')['Slider']
-	const ATreeSelect: typeof import('@arco-design/web-react')['TreeSelect']
-	const AntLayout: typeof import('antd')['Layout']
-	const ATabs: typeof import('@arco-design/web-react')['Tabs']
 	const ABackTop: typeof import('@arco-design/web-react')['BackTop']
-	const AntTour: typeof import('antd')['Tour']
+	const AntDrawer: typeof import('antd')['Drawer']
 	const AButton: typeof import('@arco-design/web-react')['Button']
-	const AntSwitch: typeof import('antd')['Switch']
-	const AntTooltip: typeof import('antd')['Tooltip']
-	const AForm: typeof import('@arco-design/web-react')['Form']
-	const AGrid: typeof import('@arco-design/web-react')['Grid']
-	const APagination: typeof import('@arco-design/web-react')['Pagination']
-	const AntProgress: typeof import('antd')['Progress']
-	const AntRadio: typeof import('antd')['Radio']
-	const Antmessage: typeof import('antd')['message']
-	const ATable: typeof import('@arco-design/web-react')['Table']
-	const AntCollapse: typeof import('antd')['Collapse']
-	const Antnotification: typeof import('antd')['notification']
-	const AntPopconfirm: typeof import('antd')['Popconfirm']
-	const AColorPicker: typeof import('@arco-design/web-react')['ColorPicker']
+	const AUpload: typeof import('@arco-design/web-react')['Upload']
+	const ATypography: typeof import('@arco-design/web-react')['Typography']
+	const ATabs: typeof import('@arco-design/web-react')['Tabs']
+	const ASkeleton: typeof import('@arco-design/web-react')['Skeleton']
+	const AntTag: typeof import('antd')['Tag']
+	const AntTypography: typeof import('antd')['Typography']
+	const AInputNumber: typeof import('@arco-design/web-react')['InputNumber']
+	const AEmpty: typeof import('@arco-design/web-react')['Empty']
 	const AntTransfer: typeof import('antd')['Transfer']
-	const AWatermark: typeof import('@arco-design/web-react')['Watermark']
-	const AntRate: typeof import('antd')['Rate']
-	const ASpace: typeof import('@arco-design/web-react')['Space']
-	const ABadge: typeof import('@arco-design/web-react')['Badge']
-	const AntTable: typeof import('antd')['Table']
-	const AntCascader: typeof import('antd')['Cascader']
-	const AAvatar: typeof import('@arco-design/web-react')['Avatar']
-	const AIcon: typeof import('@arco-design/web-react')['Icon']
-	const ACard: typeof import('@arco-design/web-react')['Card']
-	const AInput: typeof import('@arco-design/web-react')['Input']
-	const APageHeader: typeof import('@arco-design/web-react')['PageHeader']
-	const Anttheme: typeof import('antd')['theme']
-	const AMessage: typeof import('@arco-design/web-react')['Message']
-	const AntSkeleton: typeof import('antd')['Skeleton']
-	const AResult: typeof import('@arco-design/web-react')['Result']
+	const APopconfirm: typeof import('@arco-design/web-react')['Popconfirm']
+	const AConfigProvider: typeof import('@arco-design/web-react')['ConfigProvider']
+	const AntRadio: typeof import('antd')['Radio']
+	const AForm: typeof import('@arco-design/web-react')['Form']
 	const AAnchor: typeof import('@arco-design/web-react')['Anchor']
-	const ANotification: typeof import('@arco-design/web-react')['Notification']
-	const AntAlert: typeof import('antd')['Alert']
-	const ABreadcrumb: typeof import('@arco-design/web-react')['Breadcrumb']
+	const AImage: typeof import('@arco-design/web-react')['Image']
+	const AntMentions: typeof import('antd')['Mentions']
+	const AntApp: typeof import('antd')['App']
+	const AntTooltip: typeof import('antd')['Tooltip']
 	const APopover: typeof import('@arco-design/web-react')['Popover']
-	const ALink: typeof import('@arco-design/web-react')['Link']
-	const AEmpty: typeof import('@arco-design/web-react')['Empty']
-	const AAlert: typeof import('@arco-design/web-react')['Alert']
-	const AntPagination: typeof import('antd')['Pagination']
-	const AntList: typeof import('antd')['List']
-	const AProgress: typeof import('@arco-design/web-react')['Progress']
-	const ASlider: typeof import('@arco-design/web-react')['Slider']
-	const AntDescriptions: typeof import('antd')['Descriptions']
-	const AntSegmented: typeof import('antd')['Segmented']
-	const AntEmpty: typeof import('antd')['Empty']
-	const AntTypography: typeof import('antd')['Typography']
+	const AntCarousel: typeof import('antd')['Carousel']
 	const AStatistic: typeof import('@arco-design/web-react')['Statistic']
-	const AMentions: typeof import('@arco-design/web-react')['Mentions']
-	const ADescriptions: typeof import('@arco-design/web-react')['Descriptions']
-	const APortal: typeof import('@arco-design/web-react')['Portal']
-	const ATooltip: typeof import('@arco-design/web-react')['Tooltip']
-	const AntTabs: typeof import('antd')['Tabs']
-	const ADrawer: typeof import('@arco-design/web-react')['Drawer']
-	const ACheckbox: typeof import('@arco-design/web-react')['Checkbox']
-	const AntDrawer: typeof import('antd')['Drawer']
-	const AntTimeline: typeof import('antd')['Timeline']
-	const ADatePicker: typeof import('@arco-design/web-react')['DatePicker']
-	const ATimeline: typeof import('@arco-design/web-react')['Timeline']
-	const AList: typeof import('@arco-design/web-react')['List']
-	const AntMenu: typeof import('antd')['Menu']
-	const AntCheckbox: typeof import('antd')['Checkbox']
+	const AntDivider: typeof import('antd')['Divider']
 	const AVerificationCode: typeof import('@arco-design/web-react')['VerificationCode']
+	const AntRate: typeof import('antd')['Rate']
+	const AWatermark: typeof import('@arco-design/web-react')['Watermark']
+	const ATransfer: typeof import('@arco-design/web-react')['Transfer']
 	const AntCol: typeof import('antd')['Col']
-	const ARate: typeof import('@arco-design/web-react')['Rate']
-	const AAffix: typeof import('@arco-design/web-react')['Affix']
-	const ASpin: typeof import('@arco-design/web-react')['Spin']
-	const ASwitch: typeof import('@arco-design/web-react')['Switch']
-	const AntBadge: typeof import('antd')['Badge']
-	const AModal: typeof import('@arco-design/web-react')['Modal']
-	const AResizeBox: typeof import('@arco-design/web-react')['ResizeBox']
-	const ASkeleton: typeof import('@arco-design/web-react')['Skeleton']
-	const AComment: typeof import('@arco-design/web-react')['Comment']
-	const AntBreadcrumb: typeof import('antd')['Breadcrumb']
-	const AntApp: typeof import('antd')['App']
-	const AntUpload: typeof import('antd')['Upload']
+	const AProgress: typeof import('@arco-design/web-react')['Progress']
+	const AntTour: typeof import('antd')['Tour']
+	const ATooltip: typeof import('@arco-design/web-react')['Tooltip']
+	const AAvatar: typeof import('@arco-design/web-react')['Avatar']
+	const AntPopconfirm: typeof import('antd')['Popconfirm']
 	const Antversion: typeof import('antd')['version']
+	const AAutoComplete: typeof import('@arco-design/web-react')['AutoComplete']
+	const AComment: typeof import('@arco-design/web-react')['Comment']
+	const AntTabs: typeof import('antd')['Tabs']
+	const AntList: typeof import('antd')['List']
+	const AntSlider: typeof import('antd')['Slider']
+	const APagination: typeof import('@arco-design/web-react')['Pagination']
+	const ACalendar: typeof import('@arco-design/web-react')['Calendar']
+	const AMessage: typeof import('@arco-design/web-react')['Message']
+	const AntImage: typeof import('antd')['Image']
+	const AInput: typeof import('@arco-design/web-react')['Input']
 	const ACascader: typeof import('@arco-design/web-react')['Cascader']
-	const ADropdown: typeof import('@arco-design/web-react')['Dropdown']
-	const ASteps: typeof import('@arco-design/web-react')['Steps']
-	const AUpload: typeof import('@arco-design/web-react')['Upload']
-	const AntSelect: typeof import('antd')['Select']
-	const AntDropdown: typeof import('antd')['Dropdown']
+	const ASpace: typeof import('@arco-design/web-react')['Space']
+	const APageHeader: typeof import('@arco-design/web-react')['PageHeader']
+	const ARate: typeof import('@arco-design/web-react')['Rate']
+	const AAlert: typeof import('@arco-design/web-react')['Alert']
 	const ACarousel: typeof import('@arco-design/web-react')['Carousel']
-	const AntImage: typeof import('antd')['Image']
-	const AAutoComplete: typeof import('@arco-design/web-react')['AutoComplete']
-	const AntAnchor: typeof import('antd')['Anchor']
-	const AntButton: typeof import('antd')['Button']
-	const AntStatistic: typeof import('antd')['Statistic']
-	const ATimePicker: typeof import('@arco-design/web-react')['TimePicker']
-	const AntCard: typeof import('antd')['Card']
-	const AntSpace: typeof import('antd')['Space']
-	const APopconfirm: typeof import('@arco-design/web-react')['Popconfirm']
-	const ADivider: typeof import('@arco-design/web-react')['Divider']
+	const AntModal: typeof import('antd')['Modal']
+	const AntPagination: typeof import('antd')['Pagination']
+	const AInputTag: typeof import('@arco-design/web-react')['InputTag']
+	const AntCollapse: typeof import('antd')['Collapse']
 	const ASelect: typeof import('@arco-design/web-react')['Select']
-	const AntTree: typeof import('antd')['Tree']
-	const AntCalendar: typeof import('antd')['Calendar']
+	const ASpin: typeof import('@arco-design/web-react')['Spin']
+	const ADatePicker: typeof import('@arco-design/web-react')['DatePicker']
+	const AntSegmented: typeof import('antd')['Segmented']
+	const ACard: typeof import('@arco-design/web-react')['Card']
+	const ATree: typeof import('@arco-design/web-react')['Tree']
+	const AntProgress: typeof import('antd')['Progress']
+	const AntCascader: typeof import('antd')['Cascader']
+	const AntRow: typeof import('antd')['Row']
+	const AntDropdown: typeof import('antd')['Dropdown']
+	const AntSkeleton: typeof import('antd')['Skeleton']
 	const AntSteps: typeof import('antd')['Steps']
-	const AntMentions: typeof import('antd')['Mentions']
-	const AntCarousel: typeof import('antd')['Carousel']
-	const AntGrid: typeof import('antd')['Grid']
-	const ATypography: typeof import('@arco-design/web-react')['Typography']
-	const AntPopover: typeof import('antd')['Popover']
-	const AInputTag: typeof import('@arco-design/web-react')['InputTag']
-	const AntAvatar: typeof import('antd')['Avatar']
-	const AntSpin: typeof import('antd')['Spin']
+	const ATreeSelect: typeof import('@arco-design/web-react')['TreeSelect']
+	const ALayout: typeof import('@arco-design/web-react')['Layout']
 	const AntAffix: typeof import('antd')['Affix']
-	const ATag: typeof import('@arco-design/web-react')['Tag']
-	const AImage: typeof import('@arco-design/web-react')['Image']
+	const Antmessage: typeof import('antd')['message']
+	const ATrigger: typeof import('@arco-design/web-react')['Trigger']
+	const AGrid: typeof import('@arco-design/web-react')['Grid']
+	const AntInput: typeof import('antd')['Input']
+	const AntResult: typeof import('antd')['Result']
+	const AColorPicker: typeof import('@arco-design/web-react')['ColorPicker']
+	const AntEmpty: typeof import('antd')['Empty']
+	const AntTimeline: typeof import('antd')['Timeline']
+	const AntAvatar: typeof import('antd')['Avatar']
+	const APortal: typeof import('@arco-design/web-react')['Portal']
 }
diff --git a/packages/react-components/playground/src/index.tsx b/packages/react-components/playground/src/index.tsx
index 06a4dd2..76fa044 100644
--- a/packages/react-components/playground/src/index.tsx
+++ b/packages/react-components/playground/src/index.tsx
@@ -1,6 +1,6 @@
 import React from 'react';
 import { createRoot } from 'react-dom/client';
-import { Main } from './main';
+import { Main } from './test';
 import './index.css'
 
 
diff --git a/packages/react-components/playground/src/test.tsx b/packages/react-components/playground/src/test.tsx
index 38a3362..0bf060d 100644
--- a/packages/react-components/playground/src/test.tsx
+++ b/packages/react-components/playground/src/test.tsx
@@ -1,4 +1,4 @@
-import{useState}from"react";import"./main.css";import FarmLogo from"./assets/logo.png";import reactLogo from"./assets/react.svg";import{ComponentF}from"./components/ComponentE.tsx";import{Space as AntSpace}from"antd";import{ComponentX}from"./components/ComponentD.tsx";import{ComponentC}from"./components/ComponentC.tsx";import{Button as AntButton}from"antd";import{ComponentB}from"./components/ComponentB.tsx";import ComponentE from"./components/ComponentE.tsx";import ComponentD from"./components/ComponentD.tsx";import ComponentA from"./components/ComponentA.tsx";export function Main(){const[count,setCount]=useState(0);console.log("rendering Main component");return(<>
+import{useState}from"react";import"./main.css";import FarmLogo from"./assets/logo.png";import reactLogo from"./assets/react.svg";import{ComponentC}from"./components/ComponentC.tsx";import{ComponentX}from"./components/ComponentD.tsx";import{ComponentB}from"./components/ComponentB.tsx";import{Space as AntSpace}from"antd";import ComponentA from"./components/ComponentA.tsx";import{Button as AntButton}from"antd";import{ComponentF}from"./components/ComponentE.tsx";import ComponentD from"./components/ComponentD.tsx";import ComponentE from"./components/ComponentE.tsx";export function Main(){const[count,setCount]=useState(0);console.log("rendering Main component");return(<>
       <div>
         <a href="https://farmfe.org/"target="_blank">
           <img src={FarmLogo}className="logo"alt="Farm logo"/>
diff --git a/packages/react-components/playground/src/types/components.d.ts b/packages/react-components/playground/src/types/components.d.ts
index 77d886f..2578cda 100644
--- a/packages/react-components/playground/src/types/components.d.ts
+++ b/packages/react-components/playground/src/types/components.d.ts
@@ -1,146 +1,146 @@
 /* generated by farm_plugin_react_components */
 export {} 
 declare global {
+	const ComponentE: typeof import('./../components/ComponentE')['default']
+	const ComponentB: typeof import('./../components/ComponentB')['ComponentB']
 	const ComponentA: typeof import('./../components/ComponentA')['default']
+	const ComponentF: typeof import('./../components/ComponentE')['ComponentF']
 	const ComponentD: typeof import('./../components/ComponentD')['default']
+	const ComponentX: typeof import('./../components/ComponentD')['ComponentX']
 	const ComponentE: typeof import('./../components/ComponentE')['ComponentE']
-	const ComponentB: typeof import('./../components/ComponentB')['ComponentB']
-	const ComponentF: typeof import('./../components/ComponentE')['ComponentF']
-	const ComponentE: typeof import('./../components/ComponentE')['default']
 	const ComponentG: typeof import('./../components/ComponentE')['ComponentG']
-	const ComponentX: typeof import('./../components/ComponentD')['ComponentX']
 	const ComponentC: typeof import('./../components/ComponentC')['ComponentC']
-	const ArcoEmpty: typeof import('@arco-design/web-react')['Empty']
-	const AntSlider: typeof import('antd')['Slider']
-	const ArcoCheckbox: typeof import('@arco-design/web-react')['Checkbox']
-	const ArcoTable: typeof import('@arco-design/web-react')['Table']
-	const ArcoTrigger: typeof import('@arco-design/web-react')['Trigger']
-	const ArcoDatePicker: typeof import('@arco-design/web-react')['DatePicker']
-	const AntInput: typeof import('antd')['Input']
-	const AntTable: typeof import('antd')['Table']
-	const AntTabs: typeof import('antd')['Tabs']
+	const AntRow: typeof import('antd')['Row']
+	const AntSpin: typeof import('antd')['Spin']
+	const ArcoAffix: typeof import('@arco-design/web-react')['Affix']
+	const AntPopover: typeof import('antd')['Popover']
 	const ArcoMenu: typeof import('@arco-design/web-react')['Menu']
-	const ArcoCarousel: typeof import('@arco-design/web-react')['Carousel']
-	const ArcoRadio: typeof import('@arco-design/web-react')['Radio']
-	const AntSegmented: typeof import('antd')['Segmented']
-	const ArcoTag: typeof import('@arco-design/web-react')['Tag']
-	const AntProgress: typeof import('antd')['Progress']
-	const Antnotification: typeof import('antd')['notification']
-	const ArcoImage: typeof import('@arco-design/web-react')['Image']
-	const ArcoCalendar: typeof import('@arco-design/web-react')['Calendar']
-	const ArcoResult: typeof import('@arco-design/web-react')['Result']
-	const ArcoCascader: typeof import('@arco-design/web-react')['Cascader']
-	const ArcoAlert: typeof import('@arco-design/web-react')['Alert']
-	const ArcoSteps: typeof import('@arco-design/web-react')['Steps']
+	const AntResult: typeof import('antd')['Result']
+	const ArcoDatePicker: typeof import('@arco-design/web-react')['DatePicker']
+	const AntCalendar: typeof import('antd')['Calendar']
 	const AntCheckbox: typeof import('antd')['Checkbox']
-	const ArcoMessage: typeof import('@arco-design/web-react')['Message']
-	const AntFlex: typeof import('antd')['Flex']
-	const AntCollapse: typeof import('antd')['Collapse']
-	const ArcoLink: typeof import('@arco-design/web-react')['Link']
-	const ArcoPagination: typeof import('@arco-design/web-react')['Pagination']
-	const ArcoSkeleton: typeof import('@arco-design/web-react')['Skeleton']
-	const AntMentions: typeof import('antd')['Mentions']
-	const AntSpin: typeof import('antd')['Spin']
-	const ArcoButton: typeof import('@arco-design/web-react')['Button']
-	const AntForm: typeof import('antd')['Form']
-	const AntTimeline: typeof import('antd')['Timeline']
-	const AntAnchor: typeof import('antd')['Anchor']
-	const ArcoResizeBox: typeof import('@arco-design/web-react')['ResizeBox']
-	const AntBadge: typeof import('antd')['Badge']
-	const ArcoTimePicker: typeof import('@arco-design/web-react')['TimePicker']
-	const ArcoTooltip: typeof import('@arco-design/web-react')['Tooltip']
-	const AntSteps: typeof import('antd')['Steps']
-	const Antmessage: typeof import('antd')['message']
-	const AntWatermark: typeof import('antd')['Watermark']
-	const ArcoCollapse: typeof import('@arco-design/web-react')['Collapse']
-	const ArcoGrid: typeof import('@arco-design/web-react')['Grid']
-	const ArcoPortal: typeof import('@arco-design/web-react')['Portal']
-	const ArcoSelect: typeof import('@arco-design/web-react')['Select']
-	const ArcoTimeline: typeof import('@arco-design/web-react')['Timeline']
+	const AntGrid: typeof import('antd')['Grid']
+	const ArcoDrawer: typeof import('@arco-design/web-react')['Drawer']
+	const AntCarousel: typeof import('antd')['Carousel']
+	const ArcoSpin: typeof import('@arco-design/web-react')['Spin']
+	const AntBreadcrumb: typeof import('antd')['Breadcrumb']
+	const ArcoAutoComplete: typeof import('@arco-design/web-react')['AutoComplete']
 	const ArcoTypography: typeof import('@arco-design/web-react')['Typography']
-	const AntUpload: typeof import('antd')['Upload']
-	const ArcoPageHeader: typeof import('@arco-design/web-react')['PageHeader']
-	const ArcoVerificationCode: typeof import('@arco-design/web-react')['VerificationCode']
-	const AntApp: typeof import('antd')['App']
-	const AntModal: typeof import('antd')['Modal']
 	const AntRate: typeof import('antd')['Rate']
+	const AntImage: typeof import('antd')['Image']
+	const ArcoComment: typeof import('@arco-design/web-react')['Comment']
+	const AntSlider: typeof import('antd')['Slider']
+	const AntModal: typeof import('antd')['Modal']
+	const ArcoDropdown: typeof import('@arco-design/web-react')['Dropdown']
+	const ArcoUpload: typeof import('@arco-design/web-react')['Upload']
+	const AntSwitch: typeof import('antd')['Switch']
+	const ArcoDescriptions: typeof import('@arco-design/web-react')['Descriptions']
+	const ArcoModal: typeof import('@arco-design/web-react')['Modal']
+	const AntDropdown: typeof import('antd')['Dropdown']
+	const AntApp: typeof import('antd')['App']
+	const ArcoPagination: typeof import('@arco-design/web-react')['Pagination']
+	const ArcoRate: typeof import('@arco-design/web-react')['Rate']
+	const ArcoPortal: typeof import('@arco-design/web-react')['Portal']
+	const AntTree: typeof import('antd')['Tree']
+	const AntWatermark: typeof import('antd')['Watermark']
+	const AntSegmented: typeof import('antd')['Segmented']
+	const AntCol: typeof import('antd')['Col']
+	const AntCascader: typeof import('antd')['Cascader']
+	const AntTypography: typeof import('antd')['Typography']
+	const AntDrawer: typeof import('antd')['Drawer']
 	const AntTour: typeof import('antd')['Tour']
-	const AntCarousel: typeof import('antd')['Carousel']
+	const AntSpace: typeof import('antd')['Space']
+	const ArcoWatermark: typeof import('@arco-design/web-react')['Watermark']
+	const AntAnchor: typeof import('antd')['Anchor']
+	const AntAffix: typeof import('antd')['Affix']
+	const AntSelect: typeof import('antd')['Select']
+	const ArcoTable: typeof import('@arco-design/web-react')['Table']
+	const ArcoTag: typeof import('@arco-design/web-react')['Tag']
 	const AntLayout: typeof import('antd')['Layout']
-	const AntSkeleton: typeof import('antd')['Skeleton']
-	const ArcoInputNumber: typeof import('@arco-design/web-react')['InputNumber']
-	const AntAlert: typeof import('antd')['Alert']
-	const AntEmpty: typeof import('antd')['Empty']
-	const AntTooltip: typeof import('antd')['Tooltip']
-	const ArcoForm: typeof import('@arco-design/web-react')['Form']
-	const ArcoNotification: typeof import('@arco-design/web-react')['Notification']
-	const ArcoTabs: typeof import('@arco-design/web-react')['Tabs']
-	const AntDivider: typeof import('antd')['Divider']
-	const AntButton: typeof import('antd')['Button']
-	const AntCard: typeof import('antd')['Card']
-	const ArcoSwitch: typeof import('@arco-design/web-react')['Switch']
-	const AntList: typeof import('antd')['List']
-	const AntSwitch: typeof import('antd')['Switch']
-	const ArcoBadge: typeof import('@arco-design/web-react')['Badge']
-	const ArcoPopconfirm: typeof import('@arco-design/web-react')['Popconfirm']
+	const AntCollapse: typeof import('antd')['Collapse']
+	const ArcoSpace: typeof import('@arco-design/web-react')['Space']
 	const ArcoBackTop: typeof import('@arco-design/web-react')['BackTop']
 	const ArcoMentions: typeof import('@arco-design/web-react')['Mentions']
-	const Anttheme: typeof import('antd')['theme']
-	const ArcoAvatar: typeof import('@arco-design/web-react')['Avatar']
-	const ArcoComment: typeof import('@arco-design/web-react')['Comment']
-	const AntCalendar: typeof import('antd')['Calendar']
-	const AntCol: typeof import('antd')['Col']
+	const AntList: typeof import('antd')['List']
+	const ArcoCheckbox: typeof import('@arco-design/web-react')['Checkbox']
+	const ArcoLayout: typeof import('@arco-design/web-react')['Layout']
+	const ArcoMessage: typeof import('@arco-design/web-react')['Message']
+	const ArcoAlert: typeof import('@arco-design/web-react')['Alert']
+	const Antversion: typeof import('antd')['version']
+	const AntTimeline: typeof import('antd')['Timeline']
+	const AntTag: typeof import('antd')['Tag']
+	const ArcoButton: typeof import('@arco-design/web-react')['Button']
 	const AntPopconfirm: typeof import('antd')['Popconfirm']
-	const AntDropdown: typeof import('antd')['Dropdown']
-	const ArcoList: typeof import('@arco-design/web-react')['List']
-	const AntTransfer: typeof import('antd')['Transfer']
-	const ArcoSlider: typeof import('@arco-design/web-react')['Slider']
-	const AntDescriptions: typeof import('antd')['Descriptions']
-	const AntResult: typeof import('antd')['Result']
+	const AntUpload: typeof import('antd')['Upload']
 	const ArcoBreadcrumb: typeof import('@arco-design/web-react')['Breadcrumb']
-	const AntRow: typeof import('antd')['Row']
-	const AntCascader: typeof import('antd')['Cascader']
-	const AntImage: typeof import('antd')['Image']
+	const ArcoCascader: typeof import('@arco-design/web-react')['Cascader']
+	const AntCard: typeof import('antd')['Card']
 	const ArcoAnchor: typeof import('@arco-design/web-react')['Anchor']
-	const ArcoUpload: typeof import('@arco-design/web-react')['Upload']
-	const ArcoSpin: typeof import('@arco-design/web-react')['Spin']
-	const ArcoModal: typeof import('@arco-design/web-react')['Modal']
+	const AntRadio: typeof import('antd')['Radio']
+	const ArcoImage: typeof import('@arco-design/web-react')['Image']
+	const ArcoCollapse: typeof import('@arco-design/web-react')['Collapse']
+	const ArcoResizeBox: typeof import('@arco-design/web-react')['ResizeBox']
+	const ArcoConfigProvider: typeof import('@arco-design/web-react')['ConfigProvider']
+	const ArcoRadio: typeof import('@arco-design/web-react')['Radio']
+	const ArcoTree: typeof import('@arco-design/web-react')['Tree']
+	const ArcoColorPicker: typeof import('@arco-design/web-react')['ColorPicker']
+	const AntDivider: typeof import('antd')['Divider']
+	const ArcoCard: typeof import('@arco-design/web-react')['Card']
+	const ArcoDivider: typeof import('@arco-design/web-react')['Divider']
+	const AntSkeleton: typeof import('antd')['Skeleton']
+	const ArcoSelect: typeof import('@arco-design/web-react')['Select']
+	const ArcoTreeSelect: typeof import('@arco-design/web-react')['TreeSelect']
+	const AntMenu: typeof import('antd')['Menu']
+	const ArcoTransfer: typeof import('@arco-design/web-react')['Transfer']
+	const ArcoCarousel: typeof import('@arco-design/web-react')['Carousel']
+	const AntForm: typeof import('antd')['Form']
+	const AntStatistic: typeof import('antd')['Statistic']
 	const ArcoInput: typeof import('@arco-design/web-react')['Input']
-	const ArcoDrawer: typeof import('@arco-design/web-react')['Drawer']
-	const AntTag: typeof import('antd')['Tag']
-	const AntTree: typeof import('antd')['Tree']
+	const ArcoStatistic: typeof import('@arco-design/web-react')['Statistic']
+	const ArcoNotification: typeof import('@arco-design/web-react')['Notification']
+	const Anttheme: typeof import('antd')['theme']
+	const ArcoTimePicker: typeof import('@arco-design/web-react')['TimePicker']
+	const ArcoForm: typeof import('@arco-design/web-react')['Form']
 	const ArcoProgress: typeof import('@arco-design/web-react')['Progress']
-	const AntPopover: typeof import('antd')['Popover']
-	const ArcoIcon: typeof import('@arco-design/web-react')['Icon']
-	const AntDrawer: typeof import('antd')['Drawer']
+	const AntInput: typeof import('antd')['Input']
+	const AntTabs: typeof import('antd')['Tabs']
+	const ArcoAvatar: typeof import('@arco-design/web-react')['Avatar']
+	const AntSteps: typeof import('antd')['Steps']
+	const AntFlex: typeof import('antd')['Flex']
+	const AntEmpty: typeof import('antd')['Empty']
+	const ArcoPopconfirm: typeof import('@arco-design/web-react')['Popconfirm']
+	const ArcoList: typeof import('@arco-design/web-react')['List']
+	const ArcoBadge: typeof import('@arco-design/web-react')['Badge']
+	const ArcoSkeleton: typeof import('@arco-design/web-react')['Skeleton']
+	const AntTransfer: typeof import('antd')['Transfer']
+	const ArcoCalendar: typeof import('@arco-design/web-react')['Calendar']
 	const ArcoPopover: typeof import('@arco-design/web-react')['Popover']
-	const AntStatistic: typeof import('antd')['Statistic']
+	const ArcoTooltip: typeof import('@arco-design/web-react')['Tooltip']
+	const AntTooltip: typeof import('antd')['Tooltip']
+	const ArcoResult: typeof import('@arco-design/web-react')['Result']
 	const AntAvatar: typeof import('antd')['Avatar']
-	const ArcoStatistic: typeof import('@arco-design/web-react')['Statistic']
-	const ArcoTree: typeof import('@arco-design/web-react')['Tree']
-	const AntMenu: typeof import('antd')['Menu']
-	const ArcoAutoComplete: typeof import('@arco-design/web-react')['AutoComplete']
-	const AntSelect: typeof import('antd')['Select']
-	const ArcoLayout: typeof import('@arco-design/web-react')['Layout']
-	const AntAffix: typeof import('antd')['Affix']
-	const ArcoSpace: typeof import('@arco-design/web-react')['Space']
-	const AntRadio: typeof import('antd')['Radio']
+	const AntProgress: typeof import('antd')['Progress']
+	const ArcoVerificationCode: typeof import('@arco-design/web-react')['VerificationCode']
+	const ArcoSteps: typeof import('@arco-design/web-react')['Steps']
+	const ArcoTimeline: typeof import('@arco-design/web-react')['Timeline']
+	const Antmessage: typeof import('antd')['message']
+	const ArcoPageHeader: typeof import('@arco-design/web-react')['PageHeader']
+	const ArcoSlider: typeof import('@arco-design/web-react')['Slider']
+	const ArcoIcon: typeof import('@arco-design/web-react')['Icon']
+	const ArcoTabs: typeof import('@arco-design/web-react')['Tabs']
+	const ArcoLink: typeof import('@arco-design/web-react')['Link']
+	const AntDescriptions: typeof import('antd')['Descriptions']
+	const ArcoGrid: typeof import('@arco-design/web-react')['Grid']
+	const AntButton: typeof import('antd')['Button']
+	const AntAlert: typeof import('antd')['Alert']
+	const ArcoInputNumber: typeof import('@arco-design/web-react')['InputNumber']
 	const ArcoInputTag: typeof import('@arco-design/web-react')['InputTag']
-	const ArcoCard: typeof import('@arco-design/web-react')['Card']
-	const ArcoTransfer: typeof import('@arco-design/web-react')['Transfer']
-	const ArcoWatermark: typeof import('@arco-design/web-react')['Watermark']
-	const ArcoTreeSelect: typeof import('@arco-design/web-react')['TreeSelect']
-	const ArcoDivider: typeof import('@arco-design/web-react')['Divider']
+	const AntTable: typeof import('antd')['Table']
+	const ArcoSwitch: typeof import('@arco-design/web-react')['Switch']
 	const AntPagination: typeof import('antd')['Pagination']
-	const AntTypography: typeof import('antd')['Typography']
-	const AntBreadcrumb: typeof import('antd')['Breadcrumb']
-	const Antversion: typeof import('antd')['version']
-	const AntGrid: typeof import('antd')['Grid']
-	const ArcoDescriptions: typeof import('@arco-design/web-react')['Descriptions']
-	const ArcoRate: typeof import('@arco-design/web-react')['Rate']
-	const AntSpace: typeof import('antd')['Space']
-	const ArcoAffix: typeof import('@arco-design/web-react')['Affix']
-	const ArcoConfigProvider: typeof import('@arco-design/web-react')['ConfigProvider']
-	const ArcoColorPicker: typeof import('@arco-design/web-react')['ColorPicker']
-	const ArcoDropdown: typeof import('@arco-design/web-react')['Dropdown']
+	const ArcoTrigger: typeof import('@arco-design/web-react')['Trigger']
+	const AntBadge: typeof import('antd')['Badge']
+	const AntMentions: typeof import('antd')['Mentions']
+	const ArcoEmpty: typeof import('@arco-design/web-react')['Empty']
+	const Antnotification: typeof import('antd')['notification']
 }
diff --git a/packages/react-components/src/lib.rs b/packages/react-components/src/lib.rs
index c2cf781..4bf03f7 100644
--- a/packages/react-components/src/lib.rs
+++ b/packages/react-components/src/lib.rs
@@ -23,6 +23,7 @@ use farmfe_core::{
 use farmfe_macro_plugin::farm_plugin;
 use farmfe_toolkit::{
   common::{build_source_map, create_swc_source_map, PathFilter, Source},
+  pluginutils::normalize_path::normalize_path,
   script::{codegen_module, parse_module, CodeGenCommentsConfig, ParseScriptModuleResult},
   swc_ecma_visit::VisitMutWith,
 };
@@ -69,7 +70,7 @@ impl FarmPluginReactComponents {
     let root_path = config.root.clone();
     let components = Arc::new(Mutex::new(HashSet::new()));
     finish_components(FinishComponentsParams {
-      root_path,
+      root_path: normalize_path(&root_path),
       resolvers,
       dirs,
       filename,
@@ -180,7 +181,7 @@ impl Plugin for FarmPluginReactComponents {
     let dirs = self.options.dirs.clone().unwrap_or(vec![]);
     let root_path = context.config.root.clone();
     finish_components(FinishComponentsParams {
-      root_path: root_path.clone(),
+      root_path: normalize_path(&root_path),
       resolvers,
       dirs,
       filename,