Where should ReactDOM be imported from?

javascript reactjs browserify
Sergei Basharov picture Sergei Basharov · Nov 6, 2015 · Viewed 78.7k times · Source

After upgrading to version 0.14.2, I see an error and recommendation to use ReactDOM.render() instead of React.render(), but whence do I import it?

When I don't import it and just running as it is, it shows it as undefined. Is it a built-in functionality or is it a 3rd party library?

Answer

Saad picture Saad · Nov 6, 2015

With the new update, all the DOM stuff you do should be done with ReactDOM instead of React. It's a separate module.

Do npm install react-dom and then, if you're using ES6, you can do:

import ReactDOM from 'react-dom';

or if you're using ES5 you can just do:

var ReactDOM = require('react-dom');

and then you can use ReactDOM.render(), ReactDOM.findDOMNode(), etc in your code.

Related questions

Is there a way to render multiple React components in the React.render() function?

For example could I do: import React from 'react'; import PanelA from './panelA.jsx'; import PanelB from './panelB.jsx'; React.render( <PanelA /> <PanelB />, document.body ); where React would render: body PanelA PanelB Currently I'm …

Read More
Receiving 'Error: Cannot find module' using browserify, gulp, react.js

So I've been playing around with React.js, gulp and browserify. Everything works great until I try to require a module in my main.js file. I am requiring components/modules in other files with no problem (see below), but …

Read More
Using gulp-browserify for my React.js modules I'm getting 'require is not defined' in the browser

I'm trying to use gulp-browserify to generate a bundle.js file that can be included to the client's browser and begin rendering React components. Here is my App.js file: /** @jsx React.DOM */ var React = require('react'); var App = React.…

Read More