Webpack / Babel / React 构建错误： "Unknown option: foo/node_modules/react/react.js.Children"

Question

我正试图用webpack构建一个项目，并用这个webpack配置做出反应：

var path = require('path');
var webpack = require('webpack');
module.exports = {
  entry: [
    'babel-polyfill',
    './app/less/main.less',
    './app/main.js',
    'webpack-dev-server/client?http://localhost:8080'
  ],
  output: {
    publicPath: '/',
    filename: 'dist/main.js'
  },
  debug: true,
  devtool: 'source-map',
  module: {
    loaders: [
      {
        test: /.js$/,
        include: path.join(__dirname, 'app'),
        loader: 'babel-loader',
        query: {
          presets: ['react', 'es2015']
        }
      },
      {
        test: /.less$/,
        loader: "style!css!autoprefixer!less"
      },
    ]
  }
};

我确信我也有所需的pm模块，并安装了webpack，但当运行webpack时，我得到：

Module build failed: ReferenceError: [BABEL] /Users/me/foo/app/main.js: Unknown option: foo/node_modules/react/react.js.Children

有什么想法吗？

Answer 1

对不起，我忘了安装babel-preset-react:

$ npm install babel-preset-react --save-dev

Answer 2

我只是想补充一点，在我卸载了一个不再在项目中使用的旧npm模块后，我得到了错误。这很奇怪，因为我在任何地方都没有使用它——卸载没有在任何地方使用的东西怎么会导致错误？

事实证明，其中一个模块子依赖项具有babel preset react，当我启动它时，我错过了将其安装到自己的项目中。因此，卸载该包也卸载了关键的babel present react！

在一年多的时间里，由于另一个包的子依赖性，我的react应用程序可以编译。。。

---

所以是的，安装babel preset react为我解决了这个问题。