diff --git a/packages/create-vite/template-react-ts/src/main.tsx b/packages/create-vite/template-react-ts/src/main.tsx
index 611e848f1a3e9c..2f01f6e7d7da51 100644
--- a/packages/create-vite/template-react-ts/src/main.tsx
+++ b/packages/create-vite/template-react-ts/src/main.tsx
@@ -3,8 +3,15 @@ import ReactDOM from 'react-dom/client'
 import App from './App'
 import './index.css'
 
-ReactDOM.createRoot(document.getElementById('root') as HTMLElement).render(
-  <React.StrictMode>
-    <App />
-  </React.StrictMode>
-)
+let rootElement: HTMLElement | null;
+
+document.addEventListener("DOMContentLoaded", () => {
+  if (!rootElement) {
+    rootElement = document.getElementById("root");
+    ReactDOM.createRoot(rootElement as HTMLElement).render(
+      <React.StrictMode>
+        <App />
+      </React.StrictMode>
+    );
+  }
+});
diff --git a/packages/create-vite/template-react/src/main.jsx b/packages/create-vite/template-react/src/main.jsx
index 9af0bb638e42c0..5224acbc26006e 100644
--- a/packages/create-vite/template-react/src/main.jsx
+++ b/packages/create-vite/template-react/src/main.jsx
@@ -3,8 +3,15 @@ import ReactDOM from 'react-dom/client'
 import App from './App'
 import './index.css'
 
-ReactDOM.createRoot(document.getElementById('root')).render(
-  <React.StrictMode>
-    <App />
-  </React.StrictMode>
-)
+let rootElement;
+
+document.addEventListener("DOMContentLoaded", function () {
+  if (!rootElement) {
+    rootElement = document.getElementById("root");
+    ReactDOM.createRoot(rootElement).render(
+      <React.StrictMode>
+            <App />
+      </React.StrictMode>
+    );
+  }
+});