[解決済み] プロップ `history` は `Router` で必須とマークされているが、その値は `undefined` である。

質問

私はReactJsの初心者です。これは私のコードです。

var React = require('react');
var ReactDOM = require('react-dom');
var {Route, Router, IndexRoute, hashHistory} = require('react-router');
var Main = require('Main');
ReactDOM.render(
  <Router history={hashHistory}>
  <Route path="/" component={Main}></Route>
</Router>, document.getElementById('app'));

を作成し、webpackでコンパイルします。また、Main コンポーネントを aliases に追加しました。 コンソールは以下のようなエラーを投げます。 私はまた、これらのリンクを読んだ。

React Router はプロップ 'history' に失敗しました、未定義です。

値が未定義の場合、history が required とマークされていることを解決するにはどうすればよいですか？

React-Routerをバージョンアップし、hashHistoryをbrowserHistoryに置き換える。

を参考にしたり、ウェブでいろいろ検索してみましたが、この問題は解決できませんでした。React Routerはバージョン4です。

どうすればいいですか？

react-router v4を使用している場合、react-router-domもインストールする必要があります。その後、react-router-domからBrowserRouterをインポートし、RouterをBrowserRouterに切り替えてください。v4では、いくつかの点が変更されているようです。また、react-routerのドキュメントが古くなっています。これは、私の作業コードです。

import React from 'react';
import ReactDOM from 'react-dom';
import { BrowserRouter, Route } from 'react-router-dom'
import App from './components/App';

ReactDOM.render((
     <BrowserRouter>
          <Route path="/" component={App}/>
     </BrowserRouter>
     ),
     document.getElementById('root')
);

ソース