feat: 修改动态组件导入方式

src/App.tsx

@@ -17,12 +17,28 @@ const SlideBox = styled(Box)(({ theme, open }) => ({
   width: "100%",
 }));
 
+const modules = import.meta.glob("./components/Pages/**/*.tsx");
+
 export default function MiniDrawer() {
   const { active, dialogOpen, activeApp } = useGlobaltore((state) => state);
+
   const Component = React.useMemo(() => {
     if (!activeApp) return null;
-    return React.lazy(() => import(`@/components/Pages/${activeApp}`));
-  }, [activeApp]);
+
+    // 获取动态导入的组件模块
+    const modulePath = `./components/Pages/${activeApp}/index.tsx`;
+    const module = modules[modulePath];
+
+    if (module) {
+      // 动态导入并返回 Promise
+      return React.lazy(
+        () => module() as Promise<{ default: React.ComponentType<any> }>
+      );
+    } else {
+      console.error(`Module not found for ${modulePath}`);
+      return null;
+    }
+  }, [activeApp, modules]);
   return (
     <Paper
       sx={{

src/main.tsx

@@ -1,5 +1,5 @@
 import ReactDOM from "react-dom/client";
-import App from "./App.tsx";
+import App from "@/App.tsx";
 import "./index.css";
 import { ThemeProvider, createTheme } from "@mui/material/styles";
 import CssBaseline from "@mui/material/CssBaseline";

vite.config.ts

@@ -10,6 +10,16 @@ export default defineConfig({
       "@": "/src",
     },
   },
+  build: {
+    rollupOptions: {
+      output: {
+        manualChunks: {
+          "react-vendor": ["react", "react-dom", "react-router-dom"],
+        },
+      },
+    },
+    target: "es2015",
+  },
   optimizeDeps: {
     include: ["react/jsx-runtime"],
   },