WebPACKのホット・ミドルウェアが熱い。ここ

Question

を交換していないことは私のサーバーのコードです：

if (process.env.NODE_ENV === 'development') { 
     // Enable logger (morgan) 
     app.use(morgan('dev')); 

     // Disable views cache 
     app.set('view cache', false); 

     var webpack = require('webpack'); 
     var webpackDevMiddleware = require('webpack-dev-middleware'); 
     var webpackHotMiddleware = require('webpack-hot-middleware'); 

     var webpackConfig = require('../client/webpack.config'); 
     var compiler = webpack(webpackConfig); 

     app.use(webpackDevMiddleware(compiler, { noInfo: true, publicPath: webpackConfig.output.publicPath })); 
     app.use(webpackHotMiddleware(compiler)); 

    } 

、ここでは私のwebpack.configです：

module.exports = { 
    entry: { 
    main: [ 
     'webpack-hot-middleware/client', 
     './client/src/main' 
    ] 
    }, 
    output: { 
    path: path.join(__dirname, 'client/build'), 
    filename: 'bundle.js', 
    publicPath: '/build/' 
    }, 
    plugins: [ 
    new AureliaWebpackPlugin(), 
    new webpack.optimize.OccurenceOrderPlugin(), 
    new webpack.HotModuleReplacementPlugin(), 
    new webpack.NoErrorsPlugin() 
    ], 
    module: { 
    loaders: [ 
     { test: /\.js$/, loader: 'babel', exclude: /node_modules/, query: {stage: 0} }, 
     { test: /\.css?$/, loader: 'style!css' }, 
     { test: /\.html$/, loader: 'raw' }, 
     { test: /\.(png|gif|jpg)$/, loader: 'url-loader?limit=8192' }, 
     { test: /\.woff2(\?v=[0-9]\.[0-9]\.[0-9])?$/, loader: 'url-loader?limit=10000&minetype=application/font-woff2' }, 
     { test: /\.woff(\?v=[0-9]\.[0-9]\.[0-9])?$/, loader: 'url-loader?limit=10000&minetype=application/font-woff' }, 
     { test: /\.(ttf|eot|svg)(\?v=[0-9]\.[0-9]\.[0-9])?$/, loader: 'file-loader' } 
    ] 
    } 
}; 

私は、ソースファイルを変更するたびに、WebPACKのは再構築します問題ない。しかし、ブラウザにホットな交換/リロードはありません...私は何かを逃していますか？私は指示をかなり厳密に守ったと思った。

ありがとうございます。

Answer 1

私の問題は実際に文書でカバーされていました。私はwebpack-hot-middlewareの上流の圧縮モジュールを使用していて、圧縮を更新していませんでした。

この問題を参照してください： 基本的にhttps://github.com/glenjamin/webpack-hot-middleware/issues/10

、あなたが圧縮を使用している場合は、あなたが^ 1.6にアップグレードしてください。私は1.2 - > 1.6.1にアップグレードしました。エントリーでは、そのようなWebPACKのホット・ミドルウェアへ

Answer 2

私はHMRを有効にするには、WebPACKのホット・ミドルウェアにいくつかのパラメータを追加したときに私の問題がうまく解決した

、およびクエリパラメータ/クライアント：

//#server.js add parameters to Enables HMR 
    app 
    .use(webpackHotMiddleware(compiler, { 
     'log': false, 
     'path': '/__webpack_hmr', 
     'heartbeat': 10 * 1000 
    })) 


//# webpack.config.js: 
     entry: { 
     main: [ 
      'webpack-hot-middleware/client?path=/__webpack_hmr&timeout=20000&reload=true', 
      './client/src/main' 
       ]