Replace deprecated ReactDOM.render with Root.render in examples. (#626)

Author: vikpe

examples/flow-with-babel/src/index.js

@@ -1,6 +1,8 @@
 // @flow
 
-import { render } from 'react-dom';
+import { createRoot } from 'react-dom/client';
 import App from './App';
 
-render(<App />, document.getElementById('app'));
+const container = document.getElementById('app');
+const root = createRoot(container);
+root.render(<App />);

examples/typescript-with-babel/src/index.tsx

@@ -1,4 +1,6 @@
-import { render } from 'react-dom';
+import { createRoot } from 'react-dom/client';
 import App from './App';
 
-render(<App />, document.getElementById('app'));
+const container = document.getElementById('app');
+const root = createRoot(container!);
+root.render(<App />);

examples/typescript-with-swc/src/index.tsx

@@ -1,4 +1,6 @@
-import { render } from 'react-dom';
+import { createRoot } from 'react-dom/client';
 import App from './App';
 
-render(<App />, document.getElementById('app'));
+const container = document.getElementById('app');
+const root = createRoot(container!);
+root.render(<App />);

examples/typescript-with-tsc/src/index.tsx

@@ -1,4 +1,6 @@
-import { render } from 'react-dom';
+import { createRoot } from 'react-dom/client';
 import App from './App';
 
-render(<App />, document.getElementById('app'));
+const container = document.getElementById('app');
+const root = createRoot(container!);
+root.render(<App />);

examples/webpack-dev-server/src/index.js

@@ -1,4 +1,6 @@
-import { render } from 'react-dom';
+import { createRoot } from 'react-dom/client';
 import App from './App';
 
-render(<App />, document.getElementById('app'));
+const container = document.getElementById('app');
+const root = createRoot(container);
+root.render(<App />);

examples/webpack-hot-middleware/src/index.js

@@ -1,4 +1,6 @@
-import { render } from 'react-dom';
+import { createRoot } from 'react-dom/client';
 import App from './App';
 
-render(<App />, document.getElementById('app'));
+const container = document.getElementById('app');
+const root = createRoot(container);
+root.render(<App />);

examples/webpack-plugin-serve/src/index.js

@@ -1,4 +1,6 @@
-import { render } from 'react-dom';
+import { createRoot } from 'react-dom/client';
 import App from './App';
 
-render(<App />, document.getElementById('app'));
+const container = document.getElementById('app');
+const root = createRoot(container);
+root.render(<App />);