阵营 - 巴贝尔不transpiling文件

Question

我打算在路由lessons的阵营

经过大量尝试，我得到了一个工作应用程序，我可以使用：

var react = require("react"); 
var Render = require('react-dom'); 
Render((
<Router history={hashHistory}> 
<Route path="/about" component={About}/> 
</Router> 
), document.getElementById('app')) 

然而大多数的例子上

网络使用import语句，因此，例如：

import { Router, Route, hashHistory } from 'react-router' 

render((
    <Router history={hashHistory}> 
    <Route path="/" component={App}/> 
    </Router> 
), document.getElementById('app')) 

主要生产以下我broswer错误： （仁德r没有定义）。

这是我web.pack.config：

​​

什么我必须做的，所以我可以开始使用import语句？

Answer 1

错误是因为您没有导入ReactDOM。做到这一点的最好办法是

import React from "react"; 
import ReactDOM from "react-dom"; 
import { Router, Route, IndexRoute, hashHistory } from "react-router"; 

import App from "./App"; 

const app = document.getElementById('app'); 

ReactDOM.render(
    <Router history={hashHistory}> 
    <Route path="/" component={App}></Route> 
    </Router>, app); 

考虑，你有一个叫做应用程序在同一个目录这样的组件：

App.js

import React from "react"; 

export default class App extends React.Component { 
    render() { 
    return (
     <div>My App!</div> 
    ); 
    } 
}