[Babel]: Unbekannte Option: foreign.Children

Question

Ich erhalte diesen Fehler, wenn ich dieses Skript bauen mit:

webpack --colors --progress --watch --config --jsx-loader webpack.config.js 

Hier ist meine package.json Datei:

{ 
    "dependencies": { 
    "autoprefixer": "^6.0.3", 
    "node-libs-browser": "^0.5.3", 
    "object-assign": "4.0.1", 
    "underscore": "1.8.3", 
    "react": "0.14.7", 
    "react-dom": "0.14.7", 
    "react-router": "2.0.0", 
    "history": "^1.17.0", 
    "superagent": "^1.8.0", 
    "react-addons-css-transition-group": "0.14.7", 
    "react-bootstrap": "0.28.2", 
    "react-select": "^1.0.0-beta9", 
    "moment": "2.11.2", 
    "truncate": "2.0.0", 
    "superagent-promise-plugin": "2.1.0", 
    "rrule": "2.1.0" 
    }, 
    "devDependencies": { 
    "babel-core": "^6.13.2", 
    "babel-loader": "^6.2.4", 
    "babel-preset-es2015": "^6.13.2", 
    "babel-preset-stage-0": "^6.5.0", 
    "babel-runtime": "^6.11.6", 
    "css-loader": "^0.23.1", 
    "eslint": "^3.2.2", 
    "eslint-config-defaults": "^9.0.0", 
    "eslint-loader": "^1.5.0", 
    "eslint-plugin-react": "^6.0.0", 
    "extract-text-webpack-plugin": "^1.0.1", 
    "file-loader": "^0.9.0", 
    "html-webpack-plugin": "^2.22.0", 
    "isparta-instrumenter-loader": "^1.0.1", 
    "jsx-loader": "0.13.2", 
    "less": "^2.3.1", 
    "less-loader": "^2.2.3", 
    "livereload": "^0.5.0", 
    "null-loader": "^0.1.1", 
    "postcss-loader": "^0.9.1", 
    "raw-loader": "^0.5.1", 
    "style-loader": "^0.13.1", 
    "webpack": "^1.12.13", 
    "webpack-livereload-plugin": "0.4.0" 
    }, 
    "babel": { 
    "presets": [ 
     "stage-0", 
     "es2015", 
     "react" 
    ] 
    } 
} 

Und mein webpack .config.js

var webpack = require('webpack'); 
var path = require('path'); 
var LiveReloadPlugin = require('webpack-livereload-plugin') 

module.exports = { 
    output: { 
     path: __dirname, 
     filename: "bundle.js", 
    }, 
    resolve: { 
     extensions: ['', '.js', '.jsx'], 
     root: [ 
      path.resolve('./../../../../../../Javascripts/modules') 
     ], 
     moduleDirectories: 
     [ 
      './../../../../../../Javascripts/modules' 
     ] 
    }, 
    module: { 
     loaders: [ 
      { test: /\.css$/, loader: "style!css" }, 
      { 
       test: /\.less$/, 
       loader: "style!css!less" 
      }, 
      { test: /\.html$/, loader: 'raw', exclude: [/node_modules/, path.resolve('./../../../../../../Javascripts/modules')] }, 
      { 
       test: /(\.jsx|\.js)$/, 
       loader: 'babel', 
       exclude: [/(node_modules|bower_components)/] 
      }, 
      { 
       test: /(\.jsx|\.js)$/, 
       loader: "eslint-loader", 
       exclude: [/node_modules/, path.resolve('./../../../../../../Javascripts/modules')] 
      } 
     ] 
    }, 
    eslint: { 
     configFile: './src/js/.eslintrc' 
    }, 
    entry: "./src/index.js", 
    plugins: [ 
     new LiveReloadPlugin() 
    ] 
}; 

Haben Sie eine Idee, wie Sie diesen Fehler beheben können? Basierend auf meinen Google-Suchanfragen handelt es sich um ein Paketversionierungsproblem, aber das ist alles, was ich herausgefunden habe.

Answer 1

Möglicherweise fehlt Ihnen das react babel presets npm-Paket.

Try this:

npm i --save-dev babel-preset-react

Answer 2

landete ich zu Babel Zurückrollen 5, und dieses Problem ging weg. Keine gute Antwort für diejenigen, die das später finden könnten, aber es funktioniert gut für meine App.