Babel 5.8.35から6.0.0にアップグレードすると、SyntaxErrorと予期しないトークンでapp.jsがコンパイルされない

Question

私のReactJSのすべてのコンポーネントをwebpackにアップグレードする処理中です。

このプロセスでは、私はbabel 5から6にアップグレードできませんでした。そうすると、app.jsクラス内で次のスタックトレースが得られます。

このコードはとうまく働い：

"babel-core": "^5.8.35", 
"babel-loader": "^5.3.3", 

しかし、6.0.0

コードへのアップグレード一度破ったです：

var objectListMap = this.state.objects.map(object => 
     <EntityObject key={object.entity._links.self.href} 
      object={object} 
      jsonAttributes={jsonAttributes} 
      attributes={this.state.attributes} 
      onUpdate={this.onUpdate} 
      onDelete={this.onDelete}/> 
    ); 

スタックトレースは次のとおりです。

ERROR in ./app.js 
Module build failed: SyntaxError: C:/Work 2016/GitHub/aaronmagi/miwdesign/mcb-server/src/main/resources/static/app.js: Unexpected token (292:3) 
    290 | 
    291 |   var objectListMap = this.state.objects.map(object => 
> 292 |     <EntityObject key={object.entity._links.self.href} 
     |    ^
    293 |           object={object} 
    294 |           jsonAttributes={jsonAttributes} 
    295 |           attributes={this.state.attributes} 
    at Parser.pp.raise (C:\Work 2016\GitHub\aaronmagi\miwdesign\mcb-server\src\main\resources\static\node_modules\babylon\index.js:1378:13) 
    at Parser.pp.unexpected (C:\Work 2016\GitHub\aaronmagi\miwdesign\mcb-server\src\main\resources\static\node_modules\babylon\index.js:2817:8) 
    at Parser.pp.parseExprAtom (C:\Work 2016\GitHub\aaronmagi\miwdesign\mcb-server\src\main\resources\static\node_modules\babylon\index.js:749:12) 
    at Parser.pp.parseExprSubscripts (C:\Work 2016\GitHub\aaronmagi\miwdesign\mcb-server\src\main\resources\static\node_modules\babylon\index.js:504:19) 
    at Parser.pp.parseMaybeUnary (C:\Work 2016\GitHub\aaronmagi\miwdesign\mcb-server\src\main\resources\static\node_modules\babylon\index.js:484:19) 
    at Parser.pp.parseExprOps (C:\Work 2016\GitHub\aaronmagi\miwdesign\mcb-server\src\main\resources\static\node_modules\babylon\index.js:415:19) 
    at Parser.pp.parseMaybeConditional (C:\Work 2016\GitHub\aaronmagi\miwdesign\mcb-server\src\main\resources\static\node_modules\babylon\index.js:397:19) 
    at Parser.pp.parseMaybeAssign (C:\Work 2016\GitHub\aaronmagi\miwdesign\mcb-server\src\main\resources\static\node_modules\babylon\index.js:360:19) 
    at Parser.pp.parseFunctionBody (C:\Work 2016\GitHub\aaronmagi\miwdesign\mcb-server\src\main\resources\static\node_modules\babylon\index.js:1116:22) 
    at Parser.pp.parseArrowExpression (C:\Work 2016\GitHub\aaronmagi\miwdesign\mcb-server\src\main\resources\static\node_modules\babylon\index.js:1104:8) 
    at Parser.pp.parseExprAtom (C:\Work 2016\GitHub\aaronmagi\miwdesign\mcb-server\src\main\resources\static\node_modules\babylon\index.js:664:21) 
    at Parser.pp.parseExprSubscripts (C:\Work 2016\GitHub\aaronmagi\miwdesign\mcb-server\src\main\resources\static\node_modules\babylon\index.js:504:19) 
    at Parser.pp.parseMaybeUnary (C:\Work 2016\GitHub\aaronmagi\miwdesign\mcb-server\src\main\resources\static\node_modules\babylon\index.js:484:19) 
    at Parser.pp.parseExprOps (C:\Work 2016\GitHub\aaronmagi\miwdesign\mcb-server\src\main\resources\static\node_modules\babylon\index.js:415:19) 
    at Parser.pp.parseMaybeConditional (C:\Work 2016\GitHub\aaronmagi\miwdesign\mcb-server\src\main\resources\static\node_modules\babylon\index.js:397:19) 
    at Parser.pp.parseMaybeAssign (C:\Work 2016\GitHub\aaronmagi\miwdesign\mcb-server\src\main\resources\static\node_modules\babylon\index.js:360:19) 
    at Parser.pp.parseExprListItem (C:\Work 2016\GitHub\aaronmagi\miwdesign\mcb-server\src\main\resources\static\node_modules\babylon\index.js:1206:16) 
    at Parser.pp.parseCallExpressionArguments (C:\Work 2016\GitHub\aaronmagi\miwdesign\mcb-server\src\main\resources\static\node_modules\babylon\index.js:580:20) 
    at Parser.pp.parseSubscripts (C:\Work 2016\GitHub\aaronmagi\miwdesign\mcb-server\src\main\resources\static\node_modules\babylon\index.js:543:29) 
    at Parser.pp.parseExprSubscripts (C:\Work 2016\GitHub\aaronmagi\miwdesign\mcb-server\src\main\resources\static\node_modules\babylon\index.js:514:15) 
    at Parser.pp.parseMaybeUnary (C:\Work 2016\GitHub\aaronmagi\miwdesign\mcb-server\src\main\resources\static\node_modules\babylon\index.js:484:19) 
    at Parser.pp.parseExprOps (C:\Work 2016\GitHub\aaronmagi\miwdesign\mcb-server\src\main\resources\static\node_modules\babylon\index.js:415:19) 
    at Parser.pp.parseMaybeConditional (C:\Work 2016\GitHub\aaronmagi\miwdesign\mcb-server\src\main\resources\static\node_modules\babylon\index.js:397:19) 
    at Parser.pp.parseMaybeAssign (C:\Work 2016\GitHub\aaronmagi\miwdesign\mcb-server\src\main\resources\static\node_modules\babylon\index.js:360:19) 
    at Parser.pp.parseVar (C:\Work 2016\GitHub\aaronmagi\miwdesign\mcb-server\src\main\resources\static\node_modules\babylon\index.js:2274:24) 
    at Parser.pp.parseVarStatement (C:\Work 2016\GitHub\aaronmagi\miwdesign\mcb-server\src\main\resources\static\node_modules\babylon\index.js:2121:8) 
    at Parser.pp.parseStatement (C:\Work 2016\GitHub\aaronmagi\miwdesign\mcb-server\src\main\resources\static\node_modules\babylon\index.js:1831:19) 
    at Parser.pp.parseBlockBody (C:\Work 2016\GitHub\aaronmagi\miwdesign\mcb-server\src\main\resources\static\node_modules\babylon\index.js:2208:21) 
    at Parser.pp.parseBlock (C:\Work 2016\GitHub\aaronmagi\miwdesign\mcb-server\src\main\resources\static\node_modules\babylon\index.js:2189:8) 
    at Parser.pp.parseFunctionBody (C:\Work 2016\GitHub\aaronmagi\miwdesign\mcb-server\src\main\resources\static\node_modules\babylon\index.js:1125:22) 

package.json

"dependencies": { 
    "babel-core": "^6.0.0", 
    "babel-loader": "^6.0.0", 
    "react": "^15.0.1", 
    "react-dom": "^15.0.1", 
    "rest": "^1.3.2", 
    "sockjs-client": "^1.0.3", 
    "stompjs": "^2.3.3", 
    "webpack": "^1.13.0" 
    }, 
    "scripts": { 
    "watch": "webpack --watch -d" 
    } 

webpack.config.js

var path = require('path'); 

    var node_dir = __dirname + '/node_modules'; 

    module.exports = { 
     entry: './app.js', 
     devtool: 'sourcemaps', 
     cache: true, 
     debug: true, 
     resolve: { 
      alias: { 
       'stompjs': node_dir + '/stompjs/lib/stomp.js', 
       'when': node_dir + '/rest/node_modules/when/when.js' 
      } 
     }, 
     output: { 
      path: __dirname, 
      filename: './built/bundle.js' 
     }, 
     module: { 
      loaders: [ 
       { 
        test: path.join(__dirname, '.'), 
        exclude: /(node_modules)/, 
        loader: 'babel-loader' 
        // TODO remove for production 
        //loaders: ['react-hot','babel-loader'] 
       } 
      ] 
     } 
    }; 

UPDATE：ソリューションは

{ 
    "presets": ["es2015", "react"] 
} 

.babelrc追加した後

package.json .BABELRCファイルや更新を追加しました

それから、package.jsonを更新する必要がありました

"babel-preset-es2015": "^6.6.0", 
"babel-preset-react": "^6.5.0", 

Answer 1

あなたは、あなたのプリセット設定よ、あなたのプロジェクトに.babelrファイルを追加バベルプリセット

react preset

es2015 preset

をインストールする必要が

{ 
    "presets": ["es2015", "react"] 
} 

Thisは、見てみるとよいチュートリアルです。