webpack 启用热更新后 如何避免每次都生成描述文件json和补丁文件js

Question

var path = require("path");var CleanWebpackPlugin = require('clean-webpack-plugin');var HtmlWebpackPlugin = require('html-webpack-plugin');var webpack = require('webpack'); // 引入 webpack 便于调用其内置插件// console.log(CleanWebpackPlugin);module.exports = {  devtool: 'inline-source-map',    devServer: {        contentBase: path.resolve(__dirname, 'dist/js'),        hot: true, // 告诉 dev-server 我们在用 HMR        hotOnly: true, // 指定如果热加载失败了禁止刷新页面 (这是 webpack 的默认行为)，这样便于我们知道失败是因为何种错误        inline:true,    },    entry: {        print:'./src/js/print.js',        index:'./src/js/index.js'    },    module:{      rules:[        {          test:/\.css$/,          use:['style-loader','css-loader']        },      ]    },    plugins: [      new CleanWebpackPlugin(['dist']),      new HtmlWebpackPlugin({            title: 'Output Management',            inject:'head',            filename:'index.html',            template:'index.html'      }),        new webpack.NamedModulesPlugin(),        new webpack.HotModuleReplacementPlugin()    ],    output: {        path: path.resolve(__dirname,'./dist'),        filename: '[name].bundle.js',        // chunkFilename:'[name].bundle.js',    },};每次都会生成这些文件 如何配置不生成呢

Answer 1

Those HMR chunks are created by HotModuleReplacementPlugin when we use --watch flag running webpack:

webpack -d --watch

The best way I found till now is to define specific folder and file for those chunks. We can do this in the output section, for example:

output: {

    path: path.join(root, "dist"),

    filename: "bundle.js",

    hotUpdateChunkFilename: 'hot/hot-update.js',

    hotUpdateMainFilename: 'hot/hot-update.json'

}

After this change, we will have only those two files created. So we can simply add them (or whole folder) to the .gitignore.

I know It's not the best solution, but I didn't found anything better for now.