2017-06-25 5 views
0

のWebPACKを使用してコードをコンパイルするときに、状態の後=予期しないトークンエラーに直面。私のコードは次のとおりです。のWebPACK、バベルエラー:モジュールのビルドに失敗しました:でSyntaxError:予期しないトークン

class GroceryItem extends React.Component { 
    state = { 
     labelValue: "Hello Pages" 
    };   
    render() { 
     return (< div onClick = { 
       this.state.labelValue 
      } > ded 

      < 
      /div>); 
     } 
    } 

私はStackOverflowで見つかったさまざまな方法を試しましたが、どれもうまくいかないようです。

.bablerc

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

.webpack..config.js

var webpack = require('webpack'); 
var path = require('path'); 
var BUILD_DIR = path.resolve(__dirname, 'public/js/'); 
var APP_DIR = path.resolve(__dirname, 'src/components'); 
var config = { 
    entry: APP_DIR + '/main.jsx', 
    output: { 
    path: BUILD_DIR, 
    filename: 'bundle.js' 
}, 
module : { 
    loaders : [ 
     { 
     test : /\.jsx?$/, 
     include : APP_DIR, 
     loader : 'babel', 
     query:{ 
      presets: ['react'] 
     } 
     } 
    ]} 
}; 

module.exports = config; 

答えて

2

あなたがそのようなクラスを宣言するbabel-preset-stage-xプリセットを必要とします。 これを参照してくださいrepl

{ 
    presets: ["react", "es2015", "stage-2"] 

} 
+0

これは魅力的です。ありがとう。 'npm install -save-dev babel-preset-stage-2'を実行するためにステージをnatallにするには –

+0

ええ、嬉しいです。 – nrgwsth

関連する問題