Middleware webpack software like HMR autoload

I get the following message in the browser console when I change my javascript source:

[HMR] Failed to update the following modules: (A full reboot is necessary) This usually happens because the modules that have changed (and their parents) do not know how to quickly overload themselves. See http://webpack.imtqy.com/docs/hot-module-replacement-with-webpack.html for more details.

My question is, how can I tell webpack to just reload the page when this happens?

My server is configured here:

app.use(morgan('dev')); // Disable views cache app.set('view cache', false); var webpack = require('webpack'); var webpackConfig = require('../client/webpack.config'); var compiler = webpack(webpackConfig); app.use(require("webpack-dev-middleware")(compiler, { noInfo: true, publicPath: webpackConfig.output.publicPath })); app.use(require("webpack-hot-middleware")(compiler)); 

and my webpack.config:

 var path = require('path'); var AureliaWebpackPlugin = require('../node_modules/aurelia-webpack-plugin'); var webpack = require('../node_modules/webpack'); module.exports = { entry: { main: [ 'webpack-hot-middleware/client', './client/src/main' ] }, resolve: { alias: { breeze: 'breeze-client/build/breeze.debug', resources: path.resolve( __dirname, 'src', 'resources'), utils: path.resolve( __dirname, 'src', 'resources', 'utils', 'utils'), tradestudyUtils: path.resolve( __dirname, 'src', 'resources', 'tradestudy-utils', 'tradestudy-utils') } }, output: { path: path.join(__dirname, 'client'), filename: 'bundle.js', publicPath: '/' }, devtool: 'eval', plugins: [ new webpack.optimize.OccurenceOrderPlugin(), new webpack.HotModuleReplacementPlugin(), new webpack.NoErrorsPlugin(), new AureliaWebpackPlugin() ], module: { //preLoaders: [ // {test: /\.js$/, exclude: /node_modules/, loader: 'eslint-loader'} //], loaders: [ { test: /\.scss$/, loaders: ['style', 'css', 'sass'] }, { test: /\.js$/, loader: 'babel', exclude: /node_modules/, query: { presets: ['es2015-loose', 'stage-1'], plugins: ['transform-decorators-legacy'] } }, { 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' } ] } }; 

Thank you in advance?

+5
source share
1 answer

You can pass reload to webpack-hot-middleware/client :

  entry: { main: [ 'webpack-hot-middleware/client?reload=true', './client/src/main' ] }, 
+7
source

Source: https://habr.com/ru/post/1246265/


All Articles