Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Error: Target container is not a DOM element with React

I've made this React app but i keep getting this error:

Uncaught Error: createRoot(...): Target container is not a DOM element.

Can someone help me please? This is my index.html and index.js.

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta name="theme-color" content="#000000" />
    <meta
      name="description"
      content="Web site created using create-react-app"
    />
    <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />

    <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />

    <title>React App</title>
  </head>
  <body>
    <noscript>You need to enable JavaScript to run this app.</noscript>
    <div id="root"></div>

  </body>
</html>
import React from "react";
import ReactDOM from "react-dom/client";
import App from "./App";
import reportWebVitals from "./reportWebVitals";

ReactDOM.createRoot(
  <React.StrictMode>
    <App />
  </React.StrictMode>,
  document.getElementById("root")
);

reportWebVitals();

I've already tried every possible solutions that are uploaded to the internet, but unfortunately non of them hasn't worked yet.

like image 953
Tevz Avatar asked Dec 27 '25 16:12

Tevz


1 Answers

As the docs say, the signature is:

ReactDOM.createRoot(rootNode).render(<App />);

And it replaces:

ReactDOM.render(<App />, rootNode)

So you need to change your code to

ReactDOM.createRoot(
  document.getElementById("root"),
)
.render(
  <React.StrictMode>
    <App />
  </React.StrictMode>,
);
like image 118
CertainPerformance Avatar answered Dec 30 '25 06:12

CertainPerformance



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!