fix: 懒加载chunk失败时自动刷新页面

部署后旧chunk文件名(带hash)被删除,浏览器若缓存了旧index.html
仍会请求旧chunk导致 "Failed to fetch dynamically imported module"。
新增 lazyRetry 包装器,检测到此错误时自动刷新页面获取新index.html。
用 sessionStorage 标记防止无限刷新。

Generated with [Devin](https://devin.ai)

Co-Authored-By: Devin <158243242+devin-ai-integration[bot]@users.noreply.github.com>
This commit is contained in:
selfrelease
2026-08-17 11:42:19 +08:00
parent fa7bf69682
commit 874f8c49bd
4 changed files with 111 additions and 66 deletions
+55 -54
View File
@@ -1,4 +1,4 @@
import { lazy, Suspense, useState, useEffect } from 'react'
import { Suspense, useState, useEffect } from 'react'
import { Routes, Route, Navigate } from 'react-router-dom'
import { Toaster } from 'sonner'
import { useAuthStore } from './store/authStore'
@@ -11,64 +11,65 @@ import PageContainer from './components/layout/PageContainer'
import { CommandPalette } from './components/ui/CommandPalette'
import { SkeletonPage } from './components/ui/Skeleton'
import ErrorBoundary from './components/ui/ErrorBoundary'
import { lazyRetry } from './lib/lazyRetry'
const Login = lazy(() => import('./pages/auth/Login'))
const Register = lazy(() => import('./pages/auth/Register'))
const ForgotPassword = lazy(() => import('./pages/auth/ForgotPassword'))
const Dashboard = lazy(() => import('./pages/Dashboard'))
const Money = lazy(() => import('./pages/Money'))
const SocialInsurance = lazy(() => import('./pages/SocialInsurance'))
const Roster = lazy(() => import('./pages/Roster'))
const OrgChart = lazy(() => import('./pages/OrgChart'))
const SupportDashboard = lazy(() => import('./pages/support/SupportDashboard'))
const Termination = lazy(() => import('./pages/Termination'))
const AIAssistant = lazy(() => import('./pages/AIAssistant'))
const Settings = lazy(() => import('./pages/Settings'))
const Evidence = lazy(() => import('./pages/Evidence'))
const Policies = lazy(() => import('./pages/Policies'))
const Attendance = lazy(() => import('./pages/Attendance'))
const Templates = lazy(() => import('./pages/Templates'))
const AuditLog = lazy(() => import('./pages/AuditLog'))
const Notifications = lazy(() => import('./pages/Notifications'))
const PortalLogin = lazy(() => import('./pages/portal/PortalLogin'))
const Payslip = lazy(() => import('./pages/portal/Payslip'))
const MyContract = lazy(() => import('./pages/portal/MyContract'))
const Onboarding = lazy(() => import('./pages/portal/Onboarding'))
const ContractConfirm = lazy(() => import('./pages/portal/ContractConfirm'))
const MyPolicies = lazy(() => import('./pages/portal/MyPolicies'))
const AutoLogin = lazy(() => import('./pages/portal/AutoLogin'))
const MedicalPeriodCalculator = lazy(() => import('./pages/tools/MedicalPeriodCalculator'))
const HealthCheck = lazy(() => import('./pages/tools/HealthCheck'))
const AnnualValueReport = lazy(() => import('./pages/tools/AnnualValueReport'))
const CalendarPage = lazy(() => import('./pages/Calendar'))
const MyAttendance = lazy(() => import('./pages/portal/MyAttendance'))
const MyLeave = lazy(() => import('./pages/portal/MyLeave'))
const SpecialStatus = lazy(() => import('./pages/SpecialStatus'))
const CompanyFiles = lazy(() => import('./pages/CompanyFiles'))
const LeaveApproval = lazy(() => import('./pages/LeaveApproval'))
const TrainingRecords = lazy(() => import('./pages/roster/TrainingRecords'))
const PerformanceRecords = lazy(() => import('./pages/roster/PerformanceRecords'))
const DisciplinaryRecords = lazy(() => import('./pages/roster/DisciplinaryRecords'))
const Login = lazyRetry(() => import('./pages/auth/Login'))
const Register = lazyRetry(() => import('./pages/auth/Register'))
const ForgotPassword = lazyRetry(() => import('./pages/auth/ForgotPassword'))
const Dashboard = lazyRetry(() => import('./pages/Dashboard'))
const Money = lazyRetry(() => import('./pages/Money'))
const SocialInsurance = lazyRetry(() => import('./pages/SocialInsurance'))
const Roster = lazyRetry(() => import('./pages/Roster'))
const OrgChart = lazyRetry(() => import('./pages/OrgChart'))
const SupportDashboard = lazyRetry(() => import('./pages/support/SupportDashboard'))
const Termination = lazyRetry(() => import('./pages/Termination'))
const AIAssistant = lazyRetry(() => import('./pages/AIAssistant'))
const Settings = lazyRetry(() => import('./pages/Settings'))
const Evidence = lazyRetry(() => import('./pages/Evidence'))
const Policies = lazyRetry(() => import('./pages/Policies'))
const Attendance = lazyRetry(() => import('./pages/Attendance'))
const Templates = lazyRetry(() => import('./pages/Templates'))
const AuditLog = lazyRetry(() => import('./pages/AuditLog'))
const Notifications = lazyRetry(() => import('./pages/Notifications'))
const PortalLogin = lazyRetry(() => import('./pages/portal/PortalLogin'))
const Payslip = lazyRetry(() => import('./pages/portal/Payslip'))
const MyContract = lazyRetry(() => import('./pages/portal/MyContract'))
const Onboarding = lazyRetry(() => import('./pages/portal/Onboarding'))
const ContractConfirm = lazyRetry(() => import('./pages/portal/ContractConfirm'))
const MyPolicies = lazyRetry(() => import('./pages/portal/MyPolicies'))
const AutoLogin = lazyRetry(() => import('./pages/portal/AutoLogin'))
const MedicalPeriodCalculator = lazyRetry(() => import('./pages/tools/MedicalPeriodCalculator'))
const HealthCheck = lazyRetry(() => import('./pages/tools/HealthCheck'))
const AnnualValueReport = lazyRetry(() => import('./pages/tools/AnnualValueReport'))
const CalendarPage = lazyRetry(() => import('./pages/Calendar'))
const MyAttendance = lazyRetry(() => import('./pages/portal/MyAttendance'))
const MyLeave = lazyRetry(() => import('./pages/portal/MyLeave'))
const SpecialStatus = lazyRetry(() => import('./pages/SpecialStatus'))
const CompanyFiles = lazyRetry(() => import('./pages/CompanyFiles'))
const LeaveApproval = lazyRetry(() => import('./pages/LeaveApproval'))
const TrainingRecords = lazyRetry(() => import('./pages/roster/TrainingRecords'))
const PerformanceRecords = lazyRetry(() => import('./pages/roster/PerformanceRecords'))
const DisciplinaryRecords = lazyRetry(() => import('./pages/roster/DisciplinaryRecords'))
// Sprint 4-5 新增页面
const EmployeeHome = lazy(() => import('./pages/portal/EmployeeHome'))
const OnboardingProgress = lazy(() => import('./pages/portal/OnboardingProgress'))
const ResignationApply = lazy(() => import('./pages/portal/ResignationApply'))
const MyEsign = lazy(() => import('./pages/portal/MyEsign'))
const MyRecords = lazy(() => import('./pages/portal/MyRecords'))
const RiskCenter = lazy(() => import('./pages/compliance/RiskCenter'))
const SalaryDashboard = lazy(() => import('./pages/SalaryDashboard'))
const CommercialInsurance = lazy(() => import('./pages/CommercialInsurance'))
const EmployeeBenefits = lazy(() => import('./pages/EmployeeBenefits'))
const ESign = lazy(() => import('./pages/ESign'))
const CommissionBonus = lazy(() => import('./pages/CommissionBonus'))
const EmployeeHome = lazyRetry(() => import('./pages/portal/EmployeeHome'))
const OnboardingProgress = lazyRetry(() => import('./pages/portal/OnboardingProgress'))
const ResignationApply = lazyRetry(() => import('./pages/portal/ResignationApply'))
const MyEsign = lazyRetry(() => import('./pages/portal/MyEsign'))
const MyRecords = lazyRetry(() => import('./pages/portal/MyRecords'))
const RiskCenter = lazyRetry(() => import('./pages/compliance/RiskCenter'))
const SalaryDashboard = lazyRetry(() => import('./pages/SalaryDashboard'))
const CommercialInsurance = lazyRetry(() => import('./pages/CommercialInsurance'))
const EmployeeBenefits = lazyRetry(() => import('./pages/EmployeeBenefits'))
const ESign = lazyRetry(() => import('./pages/ESign'))
const CommissionBonus = lazyRetry(() => import('./pages/CommissionBonus'))
// 平台管理端
const PlatformLogin = lazy(() => import('./pages/platform/PlatformLogin'))
const PlatformDashboard = lazy(() => import('./pages/platform/PlatformDashboard'))
const PlatformOrgs = lazy(() => import('./pages/platform/PlatformOrgs'))
const PlatformUsers = lazy(() => import('./pages/platform/PlatformUsers'))
const PlatformSidebar = lazy(() => import('./components/layout/PlatformSidebar'))
const PlatformLogin = lazyRetry(() => import('./pages/platform/PlatformLogin'))
const PlatformDashboard = lazyRetry(() => import('./pages/platform/PlatformDashboard'))
const PlatformOrgs = lazyRetry(() => import('./pages/platform/PlatformOrgs'))
const PlatformUsers = lazyRetry(() => import('./pages/platform/PlatformUsers'))
const PlatformSidebar = lazyRetry(() => import('./components/layout/PlatformSidebar'))
function ProtectedRoute({ children }: { children: React.ReactNode }) {
const isAuthenticated = useAuthStore((s) => s.isAuthenticated)