How to output .html to disk using Webpack-dev-server and HTML-webpack-plugin?

I use webpack and html-webpack-plugin to update my index.html file with the generated script bundle, such as bundle.[hash].js.

Then I have to run webpack-dev-server so I can load that bundle into memory and take advantage of Hot Module Replacement.

This makes the code compile twice.

However, what I would like is for webpack-dev-server to also be able to update the index.html file with the new bundle.[hash].js, because now I have to run webpack followed by webpack-dev-sever. It seems weird to compile twice.

Again, the only reason I run webpack is to get my index.html file updated with the new hash of the bundle. If I could get webpack-dev-server to output an updated index.html to disk, then I could drop the webpack command altogether.

Is this possible? If so, what would the webpack config change be? My webpack config is very long so I didnt think it would help to post it here.

[genshinw]

You can try to use ‘html-webpack-harddisk-plugin’ to output the html to disk

[leosj]

compiler.outputFileSystem.readFileSync(compiler.outputPath+‘/index.html’);