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

Question

I got this error when I run this React code:

import React from 'react';
import ReactDOM from 'react-dom';

ReactDOM.render(
  <div id="root">
  <h1>Hello, world!</h1></div>,
  document.querySelector('#root')
);

This is the error:

bundle.js:1194 Uncaught Error: _registerComponent(...): Target container is not a DOM element.(…)

Answer 1

Apparently you forgot to add the element in your page that is the reason for which react does not find a container, to avoid this kind of problem you have to create a div element with identifier root or You have to change your selector.

import React from 'react';
import ReactDOM from 'react-dom';

ReactDOM.render(
  <div id="root">
  <h1>Hello, world!</h1></div>,
  document.querySelector('body')
);

or

<div id="root"></div>

Answer 2

Try this:

In Html file:

<div id="root"></div>

In JS file:

ReactDOM.render(
    <div>
        <h1>Hello World!</h1>
    </div>,
    document.getElementById('root')
);