webpackでエラーが発生しないのに、Reactコンポーネントがレンダリングされないのはなぜですか？

Question

APP-client.js

var React = require('react'); 
var APP = require('./components/APP'); 
React.render(<APP />, document.getElementById('react-container')); 

App.js（成分） varが=は、（ '反応'）を必要と反応させ;

var APP = React.createClass({ 
    render() { 
    return (<h1>Hello World form React</h1>); 
    } 
}); 

module.exports = APP; 

私はWebPACKのに問題があったが、プリセットでそれを解決し webpack.config.jsが追加されました。今はうまくいく。

module.exports = { 
    entry: "./app-client.js", 
    output: { 
    filename: "public/bundle.js" 
}, 
module: { 
    loaders: [ 
     { 
      exclude: /(node_modules|app-server.js)/, 
      loader: "babel-loader", 
      query: { 
       presets: [ 
        'es2015', 
        'react' 
       ] 
      } 
     } 
    ] 
    } 
}; 

Index.htmlと：

<div id="react-container" class="container"> 
    <h1>Live Polling</h1> 
</div> 
<script type="text/javascript" src="bundle.js"></script> 

フォルダ構造：

app-client.js 
app-server.js 
components 
    - app.js 
public 
    - bundle.js 
    - index.html 
    - style.css 
webpack.config.js 
package.json 

私は、サーバーを起動するが、divの内側の内容は、 "反応するコンテナを" そして、WebPACKの実行コンポーネント（app.js）のもので上書きされません。

Answer 1

はrender機能はので、これを試してみてくださいReactDOMにReactモジュールから移動されましたリアクト：

var React = require('react'); 
var ReactDOM = require('react-dom'). 
var APP = require('./components/APP'); 
ReactDOM.render(<APP />, document.getElementById('react-container'));