Почему не обновляется html при использовании hmr devServer?

Question

[ruzaev2019]

Я использую webpack 5.51.1 и webpack-dev-server 4.0.0, настроил hmr, но он обновляет только css, и js ( с js hmr не работает, только live reload, тоже вопрос ). Но devServer не обновляет html совсем, перепробовал много решений, вот неработающие из них:
1. target="web"
2. hot="true"
3.

if (module.hot) {
	module.hot.accept();
}

структура папок:


webpack.dev.js

const HtmlWebpackPlugin = require('html-webpack-plugin');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const path = require('path');

module.exports = {
	mode: 'development',
	context: path.resolve(__dirname, 'src'),
	entry: {
		main: './index.js'
	},
	output: {
		filename: '[name].js',
		clean: true
	},
	devServer: {
		open: true
	},
	module: {
		rules: [{
				test: /\.css$/i,
				use: [MiniCssExtractPlugin.loader, 'css-loader']
			},
			{
				test: /\.s[ac]ss$/,
				use: [MiniCssExtractPlugin.loader, 'css-loader', 'sass-loader']
			},
			{
				test: /\.(woff|woff2|eot|ttf|otf)$/i,
				type: 'asset/resource'
			}
		]
	},
	plugins: [
		new HtmlWebpackPlugin({
			template: './html/index.html'
		}),
		new MiniCssExtractPlugin({
			filename: '[name].css'
		}),
	]
};

Answer 1

[Дмитрий Беляев]

if (module.hot) {
  module.hot.accept();
  // вот тут должна быть логика по замене старого модуля на новый
}

Для css такую логику добавляет css-loader
Для js - есть стандартное поведение - live reload
Для html - в Вашем случае html не является полноценным модулем с точки зрения webpack, ибо у Вас HtmlWebpackPlugin, который работает как бы сбоку, беря от webpack только его хуки