反应，webpack-dev-server => ReactDOM 渲染失败

Question

我正在设置一些 react/webpack/webpack-dev-server 样板来尝试，但是运行出现渲染错误。

有问题的代码来自"Thinking in React" Facebook.io page；这是失败的部分：

import React from 'react';
import ReactDOM from 'react-dom';
import App from './components/App';

ReactDOM.render(
  <div>
    <App />
  </div>,
  document.getElementById('app')
);

当我启动 webpack-dev-server 时，出现以下 webpack 构建错误：

我的 package.json 和 webpack.config.js 在 this gist。

我已经修改了 SurviveJS configuration 中的样板以支持 Jasmine 进行测试，我已经在书中的应用程序中使用它，但无法弄清楚为什么它在这里失败。

我试过用括号将 ReactDOM 的第一个参数括起来，但没有找到解决方案。我已经比较了两个应用程序之间的 package.json 和 webpack.config.js，除了标题之外没有发现任何差异。

在这一点上，我不知道要寻找什么，尽管我确信这可能是显而易见的脑残——我已经看得太久了，所以任何指点都会非常感激。

谢谢！

Answer 1

你有 .babelrc 吗？看起来 JSX 没有被转译。

反应，webpack-dev-server => ReactDOM 渲染失败

React, webpack-dev-server => ReactDOM render failure

reactjs

webpack

webpack-dev-server