Search code examples
webpackwebpack-hmr

Webpack (4) hot module reloading fetches update manifest from malformed URI


When Webpack attempts to fetch the update JSON file, it fails with the console error message:

[HMR] Update failed: Error: Manifest request to https://subdomain.localhost23dae8e1865781c26fcd.hot-update.json timed out.

Note the omission of a slash between the TLD and the path…

Devserver config:

{
  public: `subdomain.localhost`,
  publicPath: 'https://subdomain.localhost/',
  port: 9000,
  https: false,
  contentBase: path.join(__dirname),
  watchContentBase: true,
  historyApiFallback: true,
  compress: true,
  hot: true
};

What configuration is required to ensure update manifest will load from the correct path?


Solution

  • Surprisingly, the hot module replacement plugin will actually look to the config.output.publicPath property rather than the config.devServer.[static].publicPath value.

    devServer.static.publicPath (or WDS < 4, devServer.publicPath) should be the same as output.publicPath.

    Correcting the output property to use the full path https://subdomain.localhost/ corrects this problem.