diff --git a/packages/react-devtools-core/src/standalone.js b/packages/react-devtools-core/src/standalone.js
index 6b598efa22442..72b037d1747d2 100644
--- a/packages/react-devtools-core/src/standalone.js
+++ b/packages/react-devtools-core/src/standalone.js
@@ -8,10 +8,7 @@
  */
 
 import {createElement} from 'react';
-import {
-  // $FlowFixMe Flow does not yet know about flushSync()
-  flushSync,
-} from 'react-dom';
+import {flushSync} from 'react-dom';
 import {createRoot} from 'react-dom/client';
 import Bridge from 'react-devtools-shared/src/bridge';
 import Store from 'react-devtools-shared/src/devtools/store';
diff --git a/packages/react-devtools-extensions/src/main.js b/packages/react-devtools-extensions/src/main.js
index 2d67aa2cd7bde..a0f9bcea17a29 100644
--- a/packages/react-devtools-extensions/src/main.js
+++ b/packages/react-devtools-extensions/src/main.js
@@ -1,7 +1,8 @@
 /* global chrome */
 
 import {createElement} from 'react';
-import {createRoot, flushSync} from 'react-dom';
+import {flushSync} from 'react-dom';
+import {createRoot} from 'react-dom/client';
 import Bridge from 'react-devtools-shared/src/bridge';
 import Store from 'react-devtools-shared/src/devtools/store';
 import {getBrowserName, getBrowserTheme} from './utils';
diff --git a/packages/react-devtools-shell/src/app/Iframe/index.js b/packages/react-devtools-shell/src/app/Iframe/index.js
index d22c33f2d9efa..f4b562ee311db 100644
--- a/packages/react-devtools-shell/src/app/Iframe/index.js
+++ b/packages/react-devtools-shell/src/app/Iframe/index.js
@@ -2,7 +2,7 @@
 
 import * as React from 'react';
 import {Fragment} from 'react';
-import * as ReactDOM from 'react-dom';
+import {createPortal} from 'react-dom';
 
 export default function Iframe() {
   return (
@@ -56,7 +56,7 @@ function Frame(props) {
         style={iframeStyle}
       />
 
-      {element ? ReactDOM.createPortal(props.children, element) : null}
+      {element ? createPortal(props.children, element) : null}
     </Fragment>
   );
 }
diff --git a/packages/react-devtools-shell/src/app/devtools.js b/packages/react-devtools-shell/src/app/devtools.js
index a4e21c81d772f..5915275978a4b 100644
--- a/packages/react-devtools-shell/src/app/devtools.js
+++ b/packages/react-devtools-shell/src/app/devtools.js
@@ -1,8 +1,7 @@
 /** @flow */
 
 import {createElement} from 'react';
-// $FlowFixMe Flow does not yet know about createRoot()
-import {createRoot} from 'react-dom';
+import {createRoot} from 'react-dom/client';
 import {
   activate as activateBackend,
   initialize as initializeBackend,
diff --git a/packages/react-devtools-shell/src/app/index.js b/packages/react-devtools-shell/src/app/index.js
index 89f14c8e3150d..3ec70de067152 100644
--- a/packages/react-devtools-shell/src/app/index.js
+++ b/packages/react-devtools-shell/src/app/index.js
@@ -28,6 +28,7 @@ ignoreErrors([
   'Warning: Legacy context API',
   'Warning: Unsafe lifecycle methods',
   'Warning: %s is deprecated in StrictMode.', // findDOMNode
+  'Warning: ReactDOM.render is no longer supported in React 18',
 ]);
 ignoreWarnings(['Warning: componentWillReceiveProps has been renamed']);
 ignoreLogs([]);
diff --git a/packages/react-devtools-shell/src/e2e/app.js b/packages/react-devtools-shell/src/e2e/app.js
index 71f33f9044873..f9d2ba1dad5c6 100644
--- a/packages/react-devtools-shell/src/e2e/app.js
+++ b/packages/react-devtools-shell/src/e2e/app.js
@@ -4,7 +4,7 @@
 
 import * as React from 'react';
 import * as ReactDOM from 'react-dom';
-import * as ReactDOMClient from 'react-dom/client';
+import {createRoot} from 'react-dom/client';
 
 const container = document.createElement('div');
 
@@ -14,7 +14,7 @@ const container = document.createElement('div');
 // so that it can load things other than just ToDoList.
 const App = require('./apps/ListApp').default;
 
-const root = ReactDOMClient.createRoot(container);
+const root = createRoot(container);
 root.render(<App />);
 
 // ReactDOM Test Selector APIs used by Playwright e2e tests
diff --git a/packages/react-devtools-shell/src/e2e/devtools.js b/packages/react-devtools-shell/src/e2e/devtools.js
index 059d330e83c95..3b4ac2b99282a 100644
--- a/packages/react-devtools-shell/src/e2e/devtools.js
+++ b/packages/react-devtools-shell/src/e2e/devtools.js
@@ -1,6 +1,6 @@
 import * as React from 'react';
 import * as ReactDOM from 'react-dom';
-import * as ReactDOMClient from 'react-dom/client';
+import {createRoot} from 'react-dom/client';
 import {
   activate as activateBackend,
   initialize as initializeBackend,
@@ -34,7 +34,7 @@ function init(appIframe, devtoolsContainer, appSource) {
 
   inject(contentDocument, appSource, () => {
     // $FlowFixMe Flow doesn't know about createRoot() yet.
-    ReactDOMClient.createRoot(devtoolsContainer).render(
+    createRoot(devtoolsContainer).render(
       <DevTools
         hookNamesModuleLoaderFunction={hookNamesModuleLoaderFunction}
         showTabBar={true}
diff --git a/packages/react-devtools-shell/src/multi/devtools.js b/packages/react-devtools-shell/src/multi/devtools.js
index 6b1313fa7a1d5..a00e19418bf34 100644
--- a/packages/react-devtools-shell/src/multi/devtools.js
+++ b/packages/react-devtools-shell/src/multi/devtools.js
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import {createRoot} from 'react-dom';
+import {createRoot} from 'react-dom/client';
 import {
   activate as activateBackend,
   createBridge as createBackendBridge,