1

をリロードしないwebpackDevMiddleware:オートは、次のようにだから私はWebPACKのdevのミドルウェアを使用しています

const compiledWebpack = webpack(config), 
      app    = express(), 
      devMiddleware = webpackDevMiddleware(compiledWebpack, { 
      historyApiFallback: true, 
      publicPath: config.output.publicPath, 
      overlay: { 
       warnings: true, 
       errors: true 
      }, 
      compress: true, 
      stats: { colors: true } 
      }) 


    app.use(devMiddleware) 




    app.get('*', (req, res) => { 
     // Here is it! Get the index.html from the fileSystem 
     const htmlBuffer = devMiddleware.fileSystem.readFileSync(`${config.output.path}/index.html`) 

     res.send(htmlBuffer.toString()) 
    }) 

    app.listen(PORT, function() {}) 

    console.log('Running on port ' + PORT) 

しかし、何らかの理由で、私は生きてリロードを取得しておりません。オーバーレイ機能も得られません。私はwebpackhtmlpluginを使用しているので、この設定を使用しています。私はここにシンプルなコンセプトが不足していますように

は、私が感じ:(任意のアイデアを、ライブのために

答えて

4

また、あなたのサーバーでwebpack-hot-middleware

を追加する必要がリロードあなたが追加する必要があります。?。

const webpackHotMiddleware = require('webpack-hot-middleware'); 

const hotMiddleware = webpackHotMiddleware(compiledWebpack); 
app.use(hotMiddleware); 

そして、あなたはまた、あなたのWebPACKの設定で、あなたのプラグインに応募し、webpack.HotModuleReplacementPlugin'webpack-hot-middleware/client'を追加する必要があります。

entry: [ 
    'webpack-hot-middleware/client', 
    './src/index.js' // Your entry point 
], 
plugins: [ 
    new webpack.HotModuleReplacementPlugin() 
] 

詳細については、Installation & Usageを参照してください。

+0

これは役に立ちますが、実際にはまだリロードしていません。私はHMRがバンドルがリロードされたことをHMRに見ていますが、変更を見るために手動で更新する必要があります:( –

+0

HMRクライアントコードがすべてのエントリチャンクにリロードするために必要なように見える –

+1

私はそれを追加したいのですが、HMRがONになることができなくなったとき(コンソールが "フルリフレッシュが必要"と表示されているときなど)に自動的にリロードするには、 '?reload = true'を'' webpack-hot-middleware/client ''を指すwebpackエントリの終わり – krishgopinath

関連する問題