import { createRoot } from "react-dom/client"; import "./index.css"; // Minimal test component first const TestApp = () => { return (

React is Working!

If you see this, React is rendering correctly.

Loading full app...

); }; // Add error handling and ensure root element exists console.log("🚀 Starting app initialization..."); const rootElement = document.getElementById("root"); if (!rootElement) { console.error("❌ Root element not found!"); document.body.innerHTML = `

Critical Error

Root element (#root) not found in HTML.

`; } else { console.log("✅ Root element found"); try { console.log("🔄 Creating React root..."); const root = createRoot(rootElement); console.log("🔄 Rendering test component..."); // First render a simple test component root.render(); console.log("✅ Test component rendered"); // Then load the full app asynchronously setTimeout(async () => { try { console.log("🔄 Loading full App component..."); const appModule = await import("./App.tsx"); const App = appModule.default; console.log("🔄 Rendering full App..."); root.render(); console.log("✅ Full App rendered successfully"); } catch (error) { console.error("❌ Failed to load full app:", error); const errorMessage = error instanceof Error ? error.message : String(error); root.render(

App Load Error

{errorMessage}

); } }, 100); } catch (error) { console.error("❌ Failed to initialize React:", error); const errorMessage = error instanceof Error ? error.message : String(error); rootElement.innerHTML = `

React Initialization Error

${errorMessage}

`; } }