2017-04-30 8 views
1

反応ファイルのWebコンパイルエラーをコンパイルします。webpack react error:このファイルタイプを処理するために適切なローダーが必要な場合があります

ERROR in ./public/react-components/modules/user/profile/edit.js 
Module parse failed: /Workspace/bungaloow/public/react-components/modules/user/profile/edit.js Unexpected token (5:26) 
You may need an appropriate loader to handle this file type. 

WebPACKの構成:

var glob = require('glob'); 

module.exports = { 
    entry: glob.sync('./public/react-components/**/*.{js,json}'), 
    output: { 
     path: __dirname + '/public/compiled', 
     filename: "react-components.js" 
    }, 
    module: { 
     loaders: [ 
      {test: /\.js$/, loader: 'babel-loader', query: {presets: ['es2015','react']}} 
     ], 
     rules: [ 
      { 
       test: /\.json$/, 
       use: 'json-loader' 
      }, 
      { 
       test: /\.js$/, 
       use: 'babel-loader' 
      } 
     ] 
    }, 
    watch: true 
}; 
+0

あなたのルールにあなたのbabel-loaderとJSXテストがないのはなぜですか? – Li357

+0

私のルールに追加しましたが、更新されますが、同じエラーが発生しました –

+0

IIRCのエントリは2.xの配列ではないオブジェクトですか? – Li357

答えて

0

あなたはWebPACKの2構文(module.rules)とのWebPACK 1構文(module.loaders)とを混合しているコンパイラは、次のファイルを反応させ、すべてのエラーを投げているようです。あなたのbabel-loaderは正しく設定されていないので、私はWebpack 2を使用しており、それはmodule.rulesしか使用していないと思います。

私は正しいWebPACKの2構文はこのことだろうと信じて:

module: { 
    rules: [{ 
    test : /\.json$/, 
    loader : 'json-loader' // `use` is appropriate when you have to chain loaders, 
          // if there's only a single loader, use `loader` 
    }, { 
    test : /\.js$/, 
    loader : 'babel-loader', 
    options : { presets : ['es2015', 'react'] } 
    }] 
} 

詳細情報here

関連する問題