vf/vf_react
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

pref: 代码打包优化

Browse Source
This commit is contained in:
zdl
2025-10-13 19:53:13 +08:00
parent dcef2fab1a
commit cd50d718fe
20 changed files with 14957 additions and 173 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
src/layouts/Admin.js
View File

@@ -28,11 +28,12 @@ import PanelContent from 'components/Layout/PanelContent';
import AdminNavbar from 'components/Navbars/AdminNavbar.js';
import Sidebar from 'components/Sidebar/Sidebar.js';
import { SidebarContext } from 'contexts/SidebarContext';
import React, { useState } from 'react';
import React, { useState, Suspense } from 'react';
import 'react-quill/dist/quill.snow.css'; // ES6
import { Route, Routes, Navigate } from "react-router-dom";
import routes from 'routes.js';
import PageLoader from 'components/Loading/PageLoader';
import {
ArgonLogoDark,
@@ -98,7 +99,19 @@ export default function Dashboard(props) {
const getRoutes = (routes) => {
return routes.map((route, key) => {
if (route.layout === '/admin') {
return <Route path={route.path} element={route.component} key={key} />
// ⚡ 懒加载组件需要包裹在 Suspense 中
const Component = route.component;
return (
<Route
path={route.path}
element={
<Suspense fallback={<PageLoader message="加载中..." />}>
<Component />
</Suspense>
}
key={key}
/>
);
}
if (route.collapse) {
return getRoutes(route.items);

12
src/layouts/Landing.js
View File

@@ -6,10 +6,11 @@ import PanelContainer from "components/Layout/PanelContainer";
import PanelContent from "components/Layout/PanelContent";
import Sidebar from "components/Sidebar/Sidebar.js";
import { SidebarContext } from "contexts/SidebarContext";
import React, { useState } from "react";
import React, { useState, Suspense } from "react";
import { Route, Routes, Navigate } from "react-router-dom";
import routes from "routes.js";
import PageLoader from "components/Loading/PageLoader";
const Landing = () => {
const [toggleSidebar, setToggleSidebar] = useState(false);
@@ -18,10 +19,15 @@ const Landing = () => {
const getRoutes = (routes) => {
return routes.map((route, key) => {
if (route.layout === "/landing") {
const Component = route.component;
return (
<Route
path={ route.path}
element={route.component}
path={route.path}
element={
<Suspense fallback={<PageLoader message="加载中..." />}>
<Component />
</Suspense>
}
key={key}
/>
);

12
src/layouts/RTL.js
View File

@@ -35,11 +35,12 @@ import PanelContent from "components/Layout/PanelContent";
import AdminNavbar from "components/Navbars/AdminNavbar.js";
import Sidebar from "components/Sidebar/Sidebar.js";
import { SidebarContext } from "contexts/SidebarContext";
import React, { useState } from "react";
import React, { useState, Suspense } from "react";
import "react-quill/dist/quill.snow.css"; // ES6
import { Route, Routes, Navigate } from "react-router-dom";
import routes from "routes.js";
import PageLoader from "components/Loading/PageLoader";
import {
ArgonLogoDark,
@@ -112,10 +113,15 @@ export default function Dashboard(props) {
const getRoutes = (routes) => {
return routes.map((route, key) => {
if (route.layout === "/rtl") {
const Component = route.component;
return (
<Route
path={ route.path}
element={route.component}
path={route.path}
element={
<Suspense fallback={<PageLoader message="加载中..." />}>
<Component />
</Suspense>
}
key={key}
/>
);