Why can HMR and chunkhash not be used together?

Question

I know that in the webpack.config.js the HMR plugin and chunkhash can not be used together. But I don't know why. Can anybody explain it for me？

The wrong code is:

const webpack = require("webpack");
const HtmlWebpackPlugin =  require("html-webpack-plugin");

module.exports = {
    devtool: "eval-source-map",
    entry: __dirname + "/app/main.js",
    output: {
        path: __dirname + "/build",
        filename: "bundle-[chunkhash].js"//改为“bundle.js”及为正确的代码
    },
    plugins: [
        new HtmlWebpackPlugin({
            template: __dirname + "/app/index.tmp1.html"
        }),
        new webpack.HotModuleReplacementPlugin(),
    ],
}

Answer 1

With HMR, the chunk is held in memory and never emitted to disk. There is really no reason to have a hash. Now when you move to production you want that hash for cache busting purposes. Check out Paragons. It is using HMR and in the Webpack config you can see it handled with:

filename: devMode ? '[name].js' : '[name].[hash].js',
chunkFilename: devMode ? '[name].js' : '[name].[chunkhash].js',