webpack-dev-middleware не поддерживает горячую замену модулей

Я попытался использовать webpack-dev-middleware в качестве промежуточного программного обеспечения. Я собираю в памяти так, как должен, и обслуживает выходной файл JS, , но он не горячий перезарядка при сохранении.webpack-dev-middleware не поддерживает горячую замену модулей

любые идеи?

источник

2015-04-25 eyalw

Вы хотите использовать https://www.npmjs.com/package/webpack-hot-middleware или что-то подобное.

источник

2015-05-22 22:29:49 Glenjamin

Вы должны использовать webpack-hot-middleware. вот рабочий пример. Я надеюсь, что это помогает.

для WebPack конфигурации (назовем его webpack.config.dev):

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

const distPath = path.resolve(__dirname, '../dist'); 
const srcPath = path.resolve(__dirname, '../src'); 

module.exports = { 
    context: srcPath, 
    target: 'web', 

    entry: [ 
    'react-hot-loader/patch', 
    // activate HMR for React 

    // bundling the client for webpack-dev-server 
    // and connect to the provided endpoint 
    'webpack-hot-middleware/client', 

    './client/index.js' 
    // the entry point of your app 
    ], 
    output: { 
    filename: 'app.js', 
    // the output bundle 

    path: distPath, 

    publicPath:'/static/', 
    // necessary for HMR to know where to load the hot update chunks 

    pathinfo: true 
    }, 

    module: { 
    rules: [ 
     // eslint checking before processed by babel 
     {test: /\.js$/, enforce: 'pre', loader: 'eslint-loader', exclude:  /node_modules/}, 
     // babel 
     {test: /\.js$/, use: [{loader: 'babel-loader'}], exclude: /node_modules/} 
    ] 
    }, 

    plugins: [ 
    new webpack.HotModuleReplacementPlugin(), 
    // enable HMR globally 

    new webpack.DefinePlugin({ "process.env": { NODE_ENV: '"development"' }  }) 
    ] 
};

Для сервера (так называемый index.dev.js):

import path from 'path'; 
import express from 'express'; 
import React from 'react'; 
import webpack from 'webpack'; 

import webpackDevMiddleware from 'webpack-dev-middleware'; 
import webpackHotMiddleware from 'webpack-hot-middleware'; 

import { renderToString } from 'react-dom/server'; 

// the above file 
import webpackConfig from '../../webpack/webpack.config.dev'; 

// myown react Html component 
import Html from '../server/Html'; 

const app = express(); 
app.use(express.static(path.join(__dirname, '..', './public'))); 

const compiler = webpack(webpackConfig); 

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

app.get('*', (req, res) => 
    res.status(200).send(`<!doctype html>${renderToString(
    <Html />)}` 
    // This is my own Html react component. You can send a static html file here as well. 
) 
); 

app.listen(3000, (err) => { 
    if (err) { 
    console.error(err); 
    return; 
    } 
    console.info('Demo app listening on port 3000'); 
});

В конце я называю его с помощью Babel-часы:

"scripts": { 
    "start:dev": "rm -f ./dist/* && ./node_modules/.bin/babel-watch ./src/server/index.dev.js -w ./src/server", 
    },

источник

2017-04-03 15:01:30

webpack-dev-middleware не поддерживает горячую замену модулей

ответ

Смежные вопросы