From 4130498b8eabdcc1abbd2ddebd1f929c6b228bd5 Mon Sep 17 00:00:00 2001 From: zdl <3489966805@qq.com> Date: Thu, 30 Oct 2025 14:42:54 +0800 Subject: [PATCH] =?UTF-8?q?refactor:=20=E9=87=8D=E6=9E=84=20App.js=20?= =?UTF-8?q?=E4=BD=BF=E7=94=A8=E5=A3=B0=E6=98=8E=E5=BC=8F=E8=B7=AF=E7=94=B1?= =?UTF-8?q?=E9=85=8D=E7=BD=AE?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 移除 140+ 行路由定义 JSX,改用 AppRoutes 组件 - 移除 10 个懒加载组件声明 (已迁移到 routes/lazy-components.js) - 移除 ProtectedRoute/ProtectedRouteRedirect 导入 (路由系统内部处理) - 简化 AppContent 组件,只保留核心逻辑 效果: - App.js 从 330 行减少到 165 行 (-50%) - 代码职责更清晰,易于维护 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude --- src/App.js | 181 +++-------------------------------------------------- 1 file changed, 8 insertions(+), 173 deletions(-) diff --git a/src/App.js b/src/App.js index bb7b11fb..c5a9da3e 100755 --- a/src/App.js +++ b/src/App.js @@ -9,36 +9,14 @@ The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Visionware. */ -import React, { Suspense, useEffect } from "react"; +import React, { useEffect } from "react"; import { ChakraProvider } from '@chakra-ui/react'; -import { Routes, Route, Navigate } from "react-router-dom"; - -// Chakra imports -import { Box, useColorMode } from '@chakra-ui/react'; // Core Components import theme from "theme/theme.js"; -// Loading Component -import PageLoader from "components/Loading/PageLoader"; - -// Layouts - 保持同步导入（需要立即加载） -import Auth from "layouts/Auth"; -import HomeLayout from "layouts/Home"; -import MainLayout from "layouts/MainLayout"; - -// ⚡ 使用 React.lazy() 实现路由懒加载 -// 首屏不需要的组件按需加载，大幅减少初始 JS 包大小 -const Community = React.lazy(() => import("views/Community")); -const LimitAnalyse = React.lazy(() => import("views/LimitAnalyse")); -const ForecastReport = React.lazy(() => import("views/Company/ForecastReport")); -const ConceptCenter = React.lazy(() => import("views/Concept")); -const FinancialPanorama = React.lazy(() => import("views/Company/FinancialPanorama")); -const CompanyIndex = React.lazy(() => import("views/Company")); -const MarketDataView = React.lazy(() => import("views/Company/MarketDataView")); -const StockOverview = React.lazy(() => import("views/StockOverview")); -const EventDetail = React.lazy(() => import("views/EventDetail")); -const TradingSimulation = React.lazy(() => import("views/TradingSimulation")); +// Routes +import AppRoutes from './routes'; // Redux import { Provider as ReduxProvider } from 'react-redux'; @@ -46,11 +24,10 @@ import { store } from './store'; // Contexts import { AuthProvider } from "contexts/AuthContext"; +import { AuthModalProvider } from "contexts/AuthModalContext"; import { NotificationProvider, useNotification } from "contexts/NotificationContext"; // Components -import ProtectedRoute from "components/ProtectedRoute"; -import ProtectedRouteRedirect from "components/ProtectedRouteRedirect"; import ErrorBoundary from "components/ErrorBoundary"; import AuthModalManager from "components/Auth/AuthModalManager"; import NotificationContainer from "components/NotificationContainer"; @@ -109,7 +86,6 @@ function ConnectionStatusBarWrapper() { } function AppContent() { - const { colorMode } = useColorMode(); const dispatch = useDispatch(); // 🎯 PostHog Redux 初始化 @@ -119,157 +95,16 @@ function AppContent() { }, [dispatch]); return ( - + <> {/* Socket 连接状态条 */} {/* 路由切换时自动滚动到顶部 */} - - {/* 带导航栏的主布局 - 所有需要导航栏的页面都在这里 */} - {/* MainLayout 内部有 Suspense，确保导航栏始终可见 */} - }> - {/* 首页路由 */} - } /> - {/* Community页面路由 - 需要登录 */} - - - - } - /> - - {/* 概念中心路由 - 需要登录 */} - - - - } - /> - - - - } - /> - - {/* 股票概览页面路由 - 需要登录 */} - - - - } - /> - - - - } - /> - - {/* Limit Analyse页面路由 - 需要登录 */} - - - - } - /> - - {/* 模拟盘交易系统路由 - 需要登录 */} - - - - } - /> - - {/* 事件详情独立页面路由 - 需要登录（跳转模式） */} - - - - } - /> - - {/* 公司相关页面 */} - {/* 财报预测 - 需要登录（跳转模式） */} - - - - } - /> - - {/* 财务全景 - 需要登录（弹窗模式） */} - - - - } - /> - - {/* 公司页面 - 需要登录（弹窗模式） */} - - - - } - /> - - {/* 公司详情 - 需要登录（跳转模式） */} - - - - } - /> - - {/* 市场数据 - 需要登录（弹窗模式） */} - - - - } - /> - - - {/* 认证页面路由 - 不使用 MainLayout */} - } /> - - {/* 默认重定向到首页 */} - } /> - - {/* 404 页面 */} - } /> - - + {/* 应用路由 - 从 routes/index.js 导入 */} + + ); }