sintassi di importazione non funzionante con webpack

Question

Ho ricevuto l'errore Illegal import declaration. quando ho provato a integrato un repo reagire js con webpack

ho migrato il codice sorgente originale da https://github.com/dptoot/react-event-calendar/blob/master/example/src/example.js

Come ho potuto risolvere Illegal import declaration errore?

Penso che la sintassi import funzioni solo in alcuni js lib?

errore

ERROR in ./app/main.js 
Module build failed: Error: Parse Error: Line 2: Illegal import declaration 
    at throwError (/Users/poc/sandbox/ha/node_modules/jsx-loader/node_modules/jstransform/node_modules/esprima-fb/esprima.js:2823:21) 

main.js

var React = require('react'); 
const EventCalendar = require('react-event-calendar'); 

import moment from 'moment'; 
import Row from 'react-bootstrap/lib/Row'; 
import Col from 'react-bootstrap/lib/Col'; 
import Button from 'react-bootstrap/lib/Button'; 
import ButtonToolbar from 'react-bootstrap/lib/ButtonToolbar'; 
import Popover from 'react-bootstrap/lib/PopOver'; 
import Overlay from 'react-bootstrap/lib/Overlay'; 

webpack.config.js

var path = require('path'); 
var webpack = require('webpack'); 


var config = module.exports = { 
    // the base path which will be used to resolve entry points 
    context: __dirname, 
    // the main entry point for our application's frontend JS 
    entry: './app/main.js', 
    output: { 
    filename: 'main.js' 
    }, 

    resolve: { 
     extensions: ['', '.js', '.jsx', '.ts'] 
    }, 

    module: { 
    loaders: [ 
     { 
      test: /\.jsx?$/, 
      exclude: /node_modules/, 
      loader: 'jsx-loader?insertPragma=React.DOM&harmony' } 
    ] 
    } 

}; 

Answer 1

Usa Babel via babel-loader trasformare import dichiarazioni (e altri ES2015 se volete) . http://babeljs.io/docs/setup/#webpack

Answer 2

Come risposta @JMM, sembra che sia necessario babel-loader. Inoltre, ero ancora affrontando lo stesso problema, e, infine, si risolvono modificando webpack.config.js tali come

module: { 
    loaders: [ 
-  {test: /\.jsx?$/, loader: 'babel-loader'}, 
-  {test: /\.jsx$/, loader: 'jsx-loader'} 
+  {test: /\.jsx$/, loader: 'jsx-loader'}, 
+  {test: /\.jsx?$/, loader: 'babel-loader'} 
    ] 
    }, 

o perché jsx-loader non appare più lavorare con questa configurazione, si può essere eliminato.

Spero che possa essere d'aiuto