diff --git a/src/index.js b/src/index.js index 84dd3555..2521860d 100755 --- a/src/index.js +++ b/src/index.js @@ -119,12 +119,10 @@ function registerServiceWorker() { } } -// 启动应用(MSW 异步初始化,不阻塞首屏渲染) -function startApp() { - // Create root +// 渲染应用 +function renderApp() { const root = ReactDOM.createRoot(document.getElementById('root')); - // ✅ 先渲染应用,不等待 MSW // StrictMode 已启用(Chakra UI 2.10.9+ 已修复兼容性问题) root.render( @@ -139,33 +137,30 @@ function startApp() { ); - // ✅ 后台异步启动 MSW(不阻塞首屏渲染) - if (process.env.NODE_ENV === 'development' && process.env.REACT_APP_ENABLE_MOCK === 'true') { - const initMSW = async () => { - try { - const { startMockServiceWorker } = await import('./mocks/browser'); - await startMockServiceWorker(); - console.log( - '%c[MSW] ✅ Mock Service Worker 已在后台启动', - 'color: #4CAF50; font-weight: bold;' - ); - } catch (error) { - console.error('[MSW] ❌ Mock Service Worker 启动失败:', error); - } - }; - - // 使用 requestIdleCallback 在浏览器空闲时初始化,不阻塞首屏 - if ('requestIdleCallback' in window) { - requestIdleCallback(() => initMSW(), { timeout: 3000 }); - } else { - // 降级:使用 setTimeout(0) 延迟执行 - setTimeout(initMSW, 0); - } - } - - // 注册 Service Worker + // 注册 Service Worker(非 Mock 模式) registerServiceWorker(); } +// 启动应用 +async function startApp() { + // ✅ 开发环境 Mock 模式:先启动 MSW,再渲染应用 + // 确保所有 API 请求(包括 AuthContext.checkSession)都被正确拦截 + if (process.env.NODE_ENV === 'development' && process.env.REACT_APP_ENABLE_MOCK === 'true') { + try { + const { startMockServiceWorker } = await import('./mocks/browser'); + await startMockServiceWorker(); + console.log( + '%c[MSW] ✅ Mock Service Worker 已启动,开始渲染应用', + 'color: #4CAF50; font-weight: bold;' + ); + } catch (error) { + console.error('[MSW] ❌ Mock Service Worker 启动失败,继续渲染应用:', error); + } + } + + // 渲染应用 + renderApp(); +} + // 启动应用 startApp(); \ No newline at end of file