I'm trying to create a stand-alone webpage that uses React 18:
<!DOCTYPE html>
<html lang="en">
<head>
<title>Hello React!</title>
<script crossorigin src="https://unpkg.com/react@18/umd/react.development.js"></script>
<script crossorigin src="https://unpkg.com/react-dom@18/umd/react-dom.development.js"></script>
<script src="https://unpkg.com/babel-standalone@6.26.0/babel.js"></script>
</head>
<body>
<div id="root"></div>
<script type="text/babel">
const root = ReactDOM.createRoot(document.getElementById("root"));
root.render(<h1>Hello React!</h1>);
</script>
</body>
</html>
Although the page technically works, I see this error message in the console:
Warning: You are importing createRoot from "react-dom" which is not supported. You should instead import it from "react-dom/client".
I'm not sure what to change in my script tags since I'm using the suggested CDN links. I would have thought a file called react-dom-client.development.js would exist, but I don't see it:
https://unpkg.com/browse/react-dom@18.0.0/cjs/
Any suggestions?
You can ignore this warning. A fix is coming: https://github.com/facebook/react/issues/24292#issuecomment-1091690844