2015-09-23 25 views
10

Illegal import declarationエラーが発生しました。私はWebPACKのインポート構文がwebpackで動作しない

と反応jsのレポを統合しようとしたとき、私は私がIllegal import declarationエラーを修正する可能性がどのようにhttps://github.com/dptoot/react-event-calendar/blob/master/example/src/example.js

から元のソースコードを移行しましたか?

私はimport構文は一部だけのjs libにうまくいくと思いますか?

エラー

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(あなたがしたい場合や、他のES2015)import宣言を変換するためのbabel-loader経由

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' } 
    ] 
    } 

}; 

答えて

1

@JMMは答えとして、あなたがbabel-loaderを必要とするようです。加えて、私はまだ同じ問題に直面していた、そして最終的に、このような

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

などの編集webpack.config.jsによって解決を取得またはjsx-loaderは、もはやこの設定で作業に見えないので、それは削除することができます。

は、私はそれが

を助ける願っています
関連する問題