skip to Main Content

Suddenly i got a compilation error after moving js files but i undo it it still
Here is my index.html code

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />

    <title>React App</title>
  </head>
  <body>
    <div id="roOt"></div>
  </body>
</html>

And Here is my Index.js

import React from 'react';
import ReactDOM from 'react-dom/client';
import './index.css';
import App from "./componment/App";

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

and here is the fail img
Fail capture
i would be thankfull if you give me a hint .

hint or sloution of react

2

Answers


  1. Just change id="roOt" to id="root"

    Login or Signup to reply.
  2. getElementById is case sensitive so in this case you don’t have a div with an id called "root" and instead you have an id called "roOt". According to mozilla getElementById in the docs:

    Parameters
    The ID is a case-sensitive string which is unique within the document; only one
    element should have any given ID.

    Change your id to be "root" and you’ll solve the problem

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search