ReactJS: Target container is not a dom element (non-HTML)

Question

I am having problems with My ReactJS code, and it keeps telling me that the target container is not a DOM element, no matter how many times I rearrange the code. It does NOT involve HTML and I really don't know whats causing this error. Any help? What even is a target container?

import React, { Component } from 'react';
import ReactDOM from 'react-dom';
import registerServiceWorker from './registerServiceWorker';
import Home from "./components/Home";
import login from "./components/login"
import Header from "./components/Header";
//import PageAccount from './components/PageAccount';
import PageBlog from './components/PageBlog';
import PageBlogCreate from './components/PageBlogCreate';
import PageSearch from "./components/PageSearch";
//import PageLogin from './components/PageLogin';
import PageError from './components/PageError';
import {BrowserRouter} from "react-router-dom";
import {Switch} from "react-router-dom";
import {Route} from "react-router-dom";
import "./sass/index.css";
import App from "./App";
import ContextHandler from "./ContextHandler"



ReactDOM.render((
/*
<BrowserRouter>
    <div>
        <Switch>    
            <Route path="/" exact component={Home}/>

            { /*<Route path="/about" exact component={About}/>
            <Route path="/news" exact component={News}/>
            <Route path="/login" exact component={Login}/>
<Route path="/search" exact component={Search}/> }

            <Route path="/" exact component={Header}/>
           { /*<Route path="/account" exact component={PageAccount}/>
            <Route path="/blog" exact component={PageBlog}/>
<Route path="/blog/create" exact component={PageCreateBlog}/>}

            <Route path="/search" exact component={PageSearch}/>
            {/*<Route path="/login" exact component={PageLogin}/>
            <Route path="*" component={PageError}/>}

            <Route path="/search" exact component={PageSearch}/> 
            <Route path="/login" exact component={login}/>
        { <Route path="*" component={PageError}/> }

        </Switch>
        </div>
</BrowserRouter>    
        */

//),


   <ContextHandler>
    <App /> 
    </ContextHandler>

,
 ReactDOM.render(<App />, document.getElementById('root'))));

registerServiceWorker();

Answer 1

Try this:

ReactDOM.render(
  <ContextHandler>
    <App />
  </ContextHandler>,
  document.getElementById('root')
)

And make sure your index.html contains a <div id="root"></div>.

Answer 2

You can't have nested ReactDOM.render calls like that