リアクションで太い矢印の機能（ES6）を使用できません

Question

リアクションで太い矢印の機能を使用する際に問題が発生しました。関数が匿名でない場合は、構文に不満があり、コンパイルされません。

これ：

handleItemClick = (e, { name }) => this.setState({ activeItem: name }); 

は私を与える：

BabelLoaderError: SyntaxError: Unexpected token (20:20) 

それは等号（handleItemClick '='）を指します。

しかし、これはうまく動作します：

onClick={ (arg) => {//Do something} }; 

は私のWebPACKの設定ファイル、または何か他の私が欠けていると間違って何かがありますか？何かヒントありがとう。

module.exports = { 
    entry: PATHS.app_path, 
    output:{ 
     path: PATHS.build, 
     filename: 'index.js' 
    }, 
    devServer:{ 
     inline: true, 
     port: 3333, 
     contentBase: PATHS.build, 
     publicBase: PATHS.build, 
     historyApiFallback: true 
    }, 
    resolve: { 
     root: path.resolve('./public'), 
     extensions: ['', '.js', '.jsx'] 
    }, 
    module: { 
     loaders: [ 
      { 
       test: /\.jsx?$/, 
       exclude: /(node_modules|bower_components)/, 
       loader: 'babel', 
       query: { 
        presets: ['es2015', 'react'] 
       } 
      }, 
      { 
       test: /\.css$/, 
       loader: 'style-loader' 
      }, 
      { 
       test: /\.css$/, 
       loader: 'css-loader', 
       query: { 
        modules: true, 
        localIdentName: '[local]' 
        //localIdentName: '[name]__[local]___[hash:base64:5]' 
       } 
      }, 
      { test: /\.(png|woff|woff2|eot|ttf|jpg)$/, loader: 'url-loader?limit=100000' }, 
      { 
       test: /.*\.svg$/, 
       loaders: [ 
        'file-loader', 
        'svgo-loader?' + svgoConfig, 
       ] 
      } 
     ] 
    } 
}; 

Answer 1

あなたはES6の一部ではない、とes2015でカバーされていない、とプリセットを反応class fieldsを、使用しようとしています。

query: { 
    presets: ['es2015', 'react'], 
    plugins: ["transform-class-properties"] 
} 

するか、変換プラグインが含まbabel stage-2 presetを使用します：

あなたはClass properties transform babel pluginを使用して、それを有効にすることができ

query: { 
    presets: ['es2015', 'react', 'stage-2'] 
} 

が npm installにあなたが選択したものを忘れないでください。