2017-02-14 11 views
2

私はlaravelアプリケーションでホットリロードを実装しようとしています。しかし、webpackを使って出力するのに問題があります。私がhttp://localhost/bundle.jsを実行したときに404が見つかりませんでした。なぜ私は不思議です。私の端末では、bundle.jsがwebpackにバンドルされていますが、どこに行きましたか?webpackが正しいディレクトリにファイルを出力していません

gulpfile.js

var elixir = require('laravel-elixir'); 
var webpackDevMiddleware = require('webpack-dev-middleware'); 
var webpackHotMiddleware = require('webpack-hot-middleware'); 
var webpackConfig = require('./webpack.dev.config'); 
var bundler = webpack(webpackConfig); 
    gulp.task('hot', function(){ 

     elixir(function(mix) { 

      browserSync({ 
       proxy: 'somewhere.local', 
       middleware: [ 
       webpackDevMiddleware(bundler, { 
        publicPath: '/' 
       }), 

       webpackHotMiddleware(bundler) 
       ] 
      }); 
     }); 
    }); 

webpack.dev.config.js 問題は、私はまた

<script src="http://localhost:3000/bundle.js"></script> 
を含め、ここで

module.exports = { 
    debug: true, 
    context: path.join(__dirname, 'resources/assets/bundle/entries'), 
    entry: ['./feed.js'], 
    output: { 
    path  : path.join(__dirname, 'public/bundle'), 
    publicPath : '/', 
    filename : 'bundle.js' 
    } 
    resolve: { 
    extensions: ['', '.js', '.jsx'] 
    } 
} 

私laravelビューが

です

webpack設定ファイルに何か問題があります。私のサイトディレクトリは次のとおりです: enter image description here

+3

異なるWebPACKの構成を使用して検討するかもしれません'。、あなたのスクリプトに基づいて、ルートディレクトリからスクリプトをロードしようとしていますが、これは正しくありません。 –

+0

@Aexander T.それはどうすればよいですか? bundle.jsは物理ファイルではありません。この例はhttps://github.com/eriksape/laravel-react-hot-loader/blob/master/webpack.config.jsです。あなたは、feed.jsと他の多くのファイルをbundle.jsに変換してから、browsersyncでホットリロードすることができます –

+0

私のパスの値が間違っていますか?助けてください。私はそれに何も間違いはないと思う。 –

答えて

0

webpack devserverはバンドルをディスクに書きません。

この変更されたバンドルは、publicPath(APIを参照)で指定された相対パスでメモリから提供されます。設定された出力ディレクトリには書き込まれません。バンドルがすでに同じURLパスに存在する場合、メモリ内のバンドルが優先されます(デフォルト)。

あなたはもっとここに見つけることができます:https://webpack.github.io/docs/webpack-dev-server.html

あなたの正確なニーズに応じて、あなたはあなたの `bundle`が`パブリック/バンドル/ bundle.jsに位置しています

関連する問題