Webpack和响应Es2015模块通过Babel

Im really struggling with Webpack & React. It seems for ages, Node 5.0 was not registering the npm modules I installed in the package.json 'dependencies'. Today, I upgraded Node to 5.2 and it seems to be chugging along fine now.

我真的很纠结Webpack和response。似乎很长时间以来，节点5.0都没有注册我在包中安装的npm模块。json“依赖性”。今天我把Node升级到5.2，现在看来还不错。

However, now Im struggling with getting React code in modules to work.

然而，现在我正在努力让模块中的response代码工作。

Webpack doesn't report any error. Chrome Console says:

Webpack没有报告任何错误。Chrome浏览器控制台说:

"Uncaught Error: Invariant Violation: ReactDOM.render(): Invalid component element." (which is pointing to Main.jsx file).

“未捕获错误:不变违例:反应物。render():无效的组件元素。”它指向Main。jsx文件)。

There is a lot of dependencies & my webpack config is fairly lengthy so I hesitantly post the main.jsx file content here only on SO. The whole repo (with length config files, however, the React code itself is a few lines long) is here on Bitbucket.

有很多依赖项&我的webpack配置相当长，所以我犹豫地发布了main。这里只提供jsx文件内容。整个repo(带有长度配置文件，但是，React代码本身只有几行)都在Bitbucket上。

main.jsx:

import React from 'react';
import ReactDOM from 'react-dom';
import AppParent from './components/App.jsx';
main ();
function main () {
    const app = document.createElement ('div');
    document.body.appendChild (app);
    ReactDOM.render (AppParent, app);
};

App.jsx:

import React from 'react';
import Topbar from './Topbar.jsx';
export default AppParent;
var AppParent = React.createClass ({
    render : function () {
        return (
            <div className = 'ReactParent'>
            </div>
        );
    }
});

2 个解决方案

#1

In the render method you need to render an element:

在渲染方法中，你需要渲染一个元素:

ReactDOM.render (<AppParent />, app);

You are passing a React component class.

您正在传递一个React组件类。

#2

You are not rendering an element it should be ReactDom.render(<AppParent />, app)

你没有呈现一个元素，它应该是反应。呈现(< AppParent / >,应用)

#1