2016-08-11 7 views
0

私はwebpack devサーバーにある小さなアプリケーションをバンドルしてサーバーに入れようとしています。これまでのところ、私のjsxファイルを見つけることができないようですが、これは良いことでした。Webpackがjsxファイルを見つけることができません

import Component from './component'; 
import container from './container'; 
import reducers from './reducers'; 

export default { 
    Component, 
    container, 
    Container: container(), 
    reducers 
}; 

WebPACKのは、私がバンドルを実行しようとすると文句と

client:47 ./client/ux-demo/index.js 
Module not found: Error: Cannot resolve 'file' or 'directory' ./component in /Users/me/projects/ux-demo/client/ux-demo 

解決ファイルに

言っている:私は私のそれぞれにインデックスを持っているので、のように見えるSmartコンポーネントのフォルダを反応させます実際の違いは、jsファイルではなくjsxというファイルですが、私はbabel-loaderを用意しています。

は、ここで私は、間違ってここに感謝をやっているものを私webpack.configファイル

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

module.exports = { 
    devtool: 'eval', 
    entry: [ 
    'webpack-dev-server/client?http://localhost:3000', 
    'webpack/hot/only-dev-server', 
    './client/app.jsx' 
    ], 
    output: { 
    path: path.join(__dirname, 'client'), 
    filename: 'bundle.js', 
    publicPath: '/client/' 
    }, 
    plugins: [ 
    new webpack.HotModuleReplacementPlugin() 
    ], 
    module: { 
    loaders: [{ 
     test: /\.js$/, 
     loaders: ['react-hot', 'babel-loader'], 
     include: path.join(__dirname, 'client') 
    }, { 
     test: /\.jsx$/, 
     loaders: ['react-hot', 'babel-loader'], 
     include: path.join(__dirname, 'client') 
    }] 
    } 
}; 

わからないです!

+1

ファイルを.jsxの解決WebPACKの指示する必要があります:あなたが唯一の1つの文字によって異なる2つのローダーを持っていない理由を? '/ \ .jsx?$ /'( '.js'と' .jsx'の両方にマッチします)を使ってそれらを組み合わせることができます。 – robertklep

答えて

2

あなたは余談としても

resolve:{ 
extensions:['.jsx'] 
} 
関連する問題