Fixing ReactDOM is not defined error

When you encounter an error saying ‘ReactDOM’ is not defined, it means that your application is can’t find the variable ReactDOM because it hasn’t been initialized yet.

Most likely, you forgot to import it from the package react-dom:

import ReactDOM from 'react-dom'

Or if you use ES5:

const ReactDOM = require('react-dom')

If you have the import but still got the error, check the letter case of both your import and your code that calls the variable. Make sure it’s exactly the same case. In the example below, the variable is called as ReactDom while the import is defined as ReactDOM. This will not work:

import ReactDOM from 'react-dom'

ReactDom.render()

Generally, “X is not defined error” is caused by wrong import and different letter case between import and the imported variable call. The error isn’t React specific, but a regular JavaScript import and export error.

Take your skills to the next level ⚡️

I'm sending out an occasional email with the latest tutorials on programming, web development, and statistics. Drop your email in the box below and I'll send new stuff straight into your inbox!

No spam. Unsubscribe anytime.