[解決済み】React、Uncaught ReferenceError。ReactDOMは定義されていません

質問

しています。 このルーターチュートリアルを

私のApp.jsxファイルです。

import React from 'react';
import ReactDOM from 'react-dom';
import { Router, Route, Link, browserHistory, IndexRoute  } from 'react-router'

class App extends React.Component {
render() {
  return (
     <div>
        <ul>
           <li>Home</Link>
           <li>About</Link>
           <li>Contact</Link>
        </ul>

       {this.props.children}
     </div>
  )
 }
}

export default App;

class Home extends React.Component {
render() {
  return (
     <div>
        <h1>Home...</h1>
     </div>
  )
 }
}

export default Home;

class About extends React.Component {
render() {
  return (
     <div>
        <h1>About...</h1>
     </div>
  )
 }
}

export default About;

 class Contact extends React.Component {
render() {
  return (
     <div>
        <h1>Contact...</h1>
     </div>
  )
 }
}

export default Contact;

私のMain.jsファイルです。

ReactDOM.render((
<Router history = {browserHistory}>
  <Route path = "/" component = {App}>
     <IndexRoute component = {Home} />
     <Route path = "home" component = {Home} />
     <Route path = "about" component = {About} />
     <Route path = "contact" component = {Contact} />
  </Route>
</Router>

), document.getElementById('app'))

このエラーはコンソールに書き込まれます：index.js:

Uncaught ReferenceError: ReactDOMが定義されていない

本当にどうしたらいいのかわかりません。これまですべてのチュートに従いましたが、エラーはありませんでした。ここで私は何をすべきか見当がつきません。

解決方法は？

インポートする必要があります。 ReactDOM で Main.js の代わりに {コード {コード というように {コード {コード を使用しているところです。 App.jsx

Main

ReactDOM にインポートします。 Reactも、そうですね。

インポートの仕組みは、必要なものをインポートするんだ。 必要な場所に必要な分だけ . あるファイルで一度インポートして、他のファイルで使うというのではダメなんです。

変更 react-router のようになります。

Main