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.