Как я могу использовать маршрутизатор?

Question

Кажется, что в CommonJS (ничего не значит для меня), поэтому есть некоторая ошибка в том, что экспорт не определяется, когда я пытаюсь его использовать.

Я собираюсь перейти от CommonJS к чему-то в браузере, и я могу понять, что могу использовать браузер или webpack, но я тоже не могу обойти этот материал. Очевидно, есть версия UMD-версии маршрутизатора, но я не мог понять, что это значит.

В идеале мне нужна версия реагирующего маршрутизатора, которая не требует какой-либо из этих фаз сборки, или, может быть, кто-то может дать мне одну команду оболочки liner для преобразования из CommonJS в JS?

Answer 1

ReactRoute версия 4 должна быть запрограммирована следующим образом предполагая WebPack сервер

import React from 'react'; 
import ReactDOM from 'react-dom'; 
import { Router, Route, Link, browserHistory, IndexRoute } from 'react-router' 
import Home from './Home.jsx'; 
import About from './About.jsx'; 
import Contact from './Contact.jsx'; 
import App from './App.jsx'; 

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')) 

Home.jsx

import React from 'react'; 

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

export default Home; 

здесь exportimport являются ES6 синтаксис с использованием babel-preset-es2015

Node.js package.json

{ 
    "name": "app1", 
    "version": "1.0.0", 
    "main": "main.js", 
    "scripts": { 
    "start": "webpack-dev-server --hot" 
    }, 
    "dependencies": { 
    "babel-preset-es2015": "^6.13.2", 
    "react": "^15.3.0", 
    "react-dom": "^15.3.0", 
    "react-redux": "^4.4.5", 
    "react-router": "^2.7.0", 
    "redux": "^3.5.2", 
    "webpack": "^1.13.1", 
    "webpack-dev-server": "^1.14.1" 
    } 
}