リアクタールータV4、var未定義

Question

私はここでこのチュートリアルに従っています：https://www.kirupa.com/react/creating_single_page_app_react_using_react_router.htm と静的なHTMLビルドで問題なくルータを構築しました。 私は今、Webアプリケーション用の別々のjsファイルにコードを分解しています。

私は、いつものようにindex.jsにREMDOMを置いていました。以前はvarを宣言して接頭辞を短縮すると、宣言されていないエラーが発生しました。 これは静的に機能していたので、今はなぜ今ののか分かりません。

import ReactDOM from 'react-dom'; 
    import React from 'react-router'; 
    import { Router, Route } from 'react-router' 
    import './index.css'; 
    import App from './App'; 
    import Routes from './Routes'; 
    import Contact from './Pages/Contact'; 
    import Projects from './Pages/Projects'; 
    import Home from './Pages/Home'; 


    var destination = document.querySelector("#root"); 

    var { Router, 
    Route, 
    IndexRoute, 
    IndexLink, 
    hashHistory, 
    Link } = ReactRouter; 

    ReactDOM.render(
    <Router history={hashHistory}> 
     <Route path="/" component={Routes}> 
     <IndexRoute component={Home} /> 
     <Route path="projects" component={Projects} /> 
     <Route path='contact' component={Contact} /> 
     </Route> 
    </Router>, 
    document.getElementById('root') 
    ); 

そして、私のRoutes.jsファイル：ここで私が得たものだ ./src/index.js 22行目：

import React from 'react'; 
    import ReactDOM from 'react-dom'; 

    var Routes = React.createClass({ 
     render: function() { 
     return (
    <div> 
     <h1>Simple SPA</h1> 
     <ul className="header"> 
     <li><IndexLink to="/" activeClassName="active">Home</IndexLink></li> 
     <li><Link to="products" activeClassName="active">Products</Link></li> 
     <li><Link to="contact" activeClassName="active">Contact</Link></li> 
     </ul> 
     <div className="content"> 
     {this.props.children} 
     </div> 
    </div> 
    ) 
    } 
    }); 

    export default Routes; 

私はこのエラーを取得していますしかし、 'ReactRouterは' ではありません定義されたno-undef

ご協力いただければ幸いです！

Answer 1

をどこかに定義する必要があります。これは、デストラクション割り当てvar { ... } = ReactRouter;で使用する前に行います。

import ReactRouter from 'react-router';