html-webpack-plugin: Regression in v3.0.7: breaks hot reloading in webpack-dev-server

Summary

Hi there, I just upgraded to v3.0.7 and noticed that hot reloading via webpack-dev-server has broken in a development environment.

Steps: Start webpack-dev-server, edit a watched source file Expected behavior: Observe that the bundle re-compiles, and the updated bundle is served to the browser. Actual behavior as of 3.0.7: Observe that the bundle re-compiles, but the updated bundle is not served to the browser. Note that no errors or warnings are logged. The expected behavior and actual behavior are identical in 3.0.6 and earlier.

The only change moving from 3.0.6 -> 3.0.7 is pretty minor: 26dcb98f1522e8da79e4befc24f0875bd6ef0bbc not sure if it is directly related.

I haven’t had time yet to whip up a full MCVE, but here are some snippets of config and environment to help provide context:

Config

Irrelevant portions of the config are snipped.

webpack.config.js:

module.exports = {
  entry: {
    main: ...,
  },
  output: {
    path: path.resolve(__dirname, './dist'),
    publicPath: '/dist/',
    filename: '[name].js',
  },
  module: {
    rules: [
      {
        test: /src\/.+\.js$/,
        exclude: /node_modules/,
        loader: 'babel-loader',
      },
      {
        test: /\.html$/,
        loader: 'html-loader',
      },
    ],
  },
  plugins: [
    ...
    new HTMLWebpackPlugin({
      template: 'src/resources/templates/index.html',
      inlineSource: '.js$',
    }),
    new HtmlWebpackInlineSourcePlugin(),
  ].filter(Boolean),
  devServer: {
    historyApiFallback: true,
    publicPath: '/',
  },
};

And the template index.html:

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta
      name="viewport"
      content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0"
    />
  </head>
  <body>
    <div id="app"></div>
  </body>
</html>

Environment

Operating system: linux 4.13.0-37-generic Node: 8.9.0 npm: 5.6.0 Webpack version: 4.1.1 Library version: 3.0.7

About this issue

Original URL
State: closed
Created 6 years ago
Comments: 24 (9 by maintainers)

Commits related to this issue

fix(compiler): Fallback to 3.0.7 because of #900 — committed to jantimon/html-webpack-plugin by jantimon 6 years ago

Most upvoted comments

It looks like more than once.

ghost on Mar 21, 2018

I understand that webpack-dev-server is an independent project and interoperability with it is not necessarily a priority of this plugin. However, given its popularity, perhaps it would be worth adding a note in documentation (maybe for the changelog entry of 3.0.7) that the latest version breaks compatibility with HMR, and that interested users should pin an older version. (At least until the problem is sorted out)

LINKIWI on Mar 21, 2018

I have 3.2.0 installed and i still have the same issue…HMR has stopped working

nitish24p on Apr 26, 2018