Answer the question
In order to leave comments, you need to log in
Webpack hot css reload with HMR enabled stops working, how to fix?
Good day!
I found a ready -made boilerplate for react-web-native-app on the net. Everything would be fine, but the author did not solve the problem with the work of hot-reloading less with HMR enabled.
If I comment on the line in the config new webpack.HotModuleReplacementPlugin()
, then the styles are recompiled without reloading the page. Everything is as it should be.
If I turn it on, then every file save causes a reload.
Having aired the question on the network, many write that the problem is in the extract-text-webpack-plugin, but I do not use it.
Maybe there are some guesses?
const path = require('path');
const webpack = require('webpack');
module.exports = {
devtool: 'cheap-module-eval-source-map',
entry: [
'webpack-hot-middleware/client',
'babel-polyfill',
path.join(__dirname, '../../app/web/index'),
],
output: {
path: path.join(__dirname, '../public'),
filename: 'bundle.js',
publicPath: '/',
},
module: {
loaders: [
{
test: /\.less$/,
loader: 'style!css?sourceMap!less?sourceMap',
}, {
test: /\.js$/,
exclude: /node_modules/,
loader: 'babel-loader',
query: {
presets: ['es2015', 'react'],
plugins: ,
},
}, {
test: /\.json$/,
loader: 'json',
},
],
},
plugins: [
new webpack.DefinePlugin({
'process.env': {
NODE_ENV: JSON.stringify('development'),
PLATFORM_ENV: JSON.stringify('web'),
},
}),
new webpack.optimize.OccurenceOrderPlugin(),
// new webpack.HotModuleReplacementPlugin(),
new webpack.NoErrorsPlugin(),
],
};
Answer the question
In order to leave comments, you need to log in
react-transform-hmr is now deprecated.
try installing the 3rd beta of react-hot-loader .
remove "react-transform-hmr" from config, add "plugins": ["react-hot-loader/babel"].
and in entry - add 'react-hot-loader/patch',
in general, here's the dock - here in more detail, in theory it should start.
Didn't find what you were looking for?
Ask your questionAsk a Question
731 491 924 answers to any question