为什么即使webpack不抛出任何错误，React组件不渲染？

APP-client.js

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

App.js （component）var React = require（'react'）;

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

webpack.config.js我有问题与webpack，但解决了预设添加。 现在运行良好。

 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 

我运行webpack，然后启动服务器，但div“react-container”中的内容不会被组件（app.js）的内容覆盖。

Answer 1

React render函数已经从React模块移动到ReactDOM所以请试试这个：

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