No se pueden usar las funciones de flecha dentro de la clase de componente reaccionar [duplicado]

Esta pregunta ya tiene una respuesta aquí:

¿Cómo usar las funciones de flecha (campos de clase pública) como métodos de clase? 4 respuestas

He comenzado un proyecto donde uso React JS para el front end de un nodo js en el backend. Usé webpack para agrupar archivos JS. Usé Babel junto con otras cosas necesarias. Cuando uso las funciones de flecha dentro de una clase de reacción, aparece un error de sintaxis. me gustaa construcción del módulo falló: SyntaxError: token inesperado. Pero puedo usar la función de flecha en el nodo sin ningún problema.

este es mi archivo de configuración de paquete web

import path from 'path';
import webpack from 'webpack';
import 'react-hot-loader/patch';

export default{
  devtool: 'eval',
  entry:[
    'react-hot-loader/patch',
    'webpack-hot-middleware/client?reload=true',
    path.join(__dirname,'client/index.js')],
  output:{
    path:'/',
    publicPath:'/'
  },
  plugins:[
    new webpack.NoErrorsPlugin(),
    new webpack.optimize.OccurenceOrderPlugin(),
    new webpack.HotModuleReplacementPlugin()

  ],
  module:{
    loaders:[
      {
        test:/\.js$/,
        include:path.join(__dirname,'client'),
        loaders: ['react-hot-loader/webpack', 'babel']
      },
      {
        test: /\.jpe?g$|\.gif$|\.svg$|\.png$/i,
        loader: 'file-loader?name=[name].[ext]'
      }
    ]
  },
  resolve:{
    extension:['','.js']
  }
}

Mi archivo de reacción

class mapSidebar extends React.Component{

    constructor(props,context){
       super(props,context);
       this.state = {
         dataSource: []
       };
         this.handleUpdateInput = this.handleUpdateInput.bind (this);
    }

    handleUpdateInput = (value) => {
      this.setState({
        dataSource: [
          value,
          value + value,
          value + value + value,
        ],
      });
    };

    render(){
      return(
        <div>
          <Paper zDepth={2}>
            <div>Hello</div>
            <div>
                <AutoComplete
                  hintText="Type anything"
                  dataSource={this.state.dataSource}
                  onUpdateInput={this.handleUpdateInput}
                />
          </Paper>
        </div>
      );
    }

}

export default mapSidebar;

¿Cómo resolver este problema

Respuestas a la pregunta(2)

Su respuesta a la pregunta