webpack3升级到4后，每次在开发环境都重新打模块，热加载时慢怎么解决？

Question

webpack.common.js

let lessPackage = {};

if ( NODE_ENV === 'develop') {
    lessPackage = {
        test: /\.less/,
        use:[
            'style-loader',
            'css-loader',
            'less-loader'
        ]
    };
} else if ( NODE_ENV === 'production' ) {

    lessPackage = {
        test: /\.less$/i,
        use: ExtractTextPlugin.extract({
            fallback: 'style-loader',
            use: ['css-loader', 'less-loader'],
            publicPath: '../'
        }),

    };
}

let baseConfig = {

    entry: addEntry(),
    resolve: {
        // 定义别名
        alias: {
            'PATH_SRC': path.resolve(__dirname, 'src'),
            'PATH_SRC_UTILS': path.resolve(__dirname, 'src/utils'),
            'PATH_SRC_PAGES': path.resolve(__dirname, 'src/pages')
        },
        // 告诉webpack解析模块时应该搜索哪些目录
        modules: [path.resolve(__dirname, 'src'), 'node_modules'],
        extensions: ['.js', '.jsx']
    },
    module: {
        rules: [
            lessPackage,
            {
                test: /\.scss$/,
                use:[
                    'style-loader',
                    'css-loader',
                    'sass-loader'
                ]
            },
            {
                test: /\.css$/,
                exclude: [
                    path.resolve(__dirname, 'node_modules')
                ],
                use: [
                    'style-loader',
                    'css-loader'
                ]
            },
            // {
            //     //正则匹配后缀.js文件;
            //     test: /\.js$/,
            //     //需要排除的目录
            //     exclude: /(node_modules|bower_components)/,
            //     //加载babel-loader转译es6
            //     loaders: [
            //         'babel-loader', // .babelrc 具体配置文件
            //         //'eslint-loader'// 必须在 .babelrc 的后面
            //     ]
            // },
            {
                test: /\.(jsx|js)$/,
                exclude: /(node_modules|bower_components)/,
                loaders: [
                    require.resolve('babel-loader'), // .babelrc 具体配置文件
                    //'eslint-loader'// 必须在 .babelrc 的后面
                ]

                // query: {
                //     presets: ['react', 'stage-0', 'es2015']
                // }

            },
            {
                test: /\.json$/,
                use: 'json-loader'
            },
            {
                test:/\.(png|svg|jpg|gif|ico|woff|eot|ttf)$/,
                exclude: /(public)/,
                use: [
                    {
                        loader: 'url-loader',
                        options: {

                            limit:8000000,   //小于50K的 都打包

                            name:'[hash:8].[name].[ext]',
                            // publicPath:"img/",  //替换CSS引用的图片路径 可以替换成爱拍云上的路径
                            // outputPath:"../img/"        //生成之后存放的路径
                        }
                    }
                ]
            }

        ]
    },
    performance: {
        hints: "warning", // 枚举
        maxAssetSize: 30000000, // 整数类型（以字节为单位）
        maxEntrypointSize: 50000000, // 整数类型（以字节为单位）
        assetFilter: function(assetFilename) {
            // 提供资源文件名的断言函数
            return assetFilename.endsWith('.css') || assetFilename.endsWith('.js');

        }
    },
    plugins: [
        // new CleanWebpackPlugin(['dist'], { // 清除 dist 文件中的内容
        //     exclude: [venderName + '.js'] // 排除 提取出的 第三方的 js
        // }),

        new webpack.DefinePlugin({ // 创建一个编译时可以配置的全局常量
            PRODUCTION: JSON.stringify(true),
            'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV || 'development')
        }),
        new HelloWorldPlugin({options: true})
    ]
};

webpack.dev.js

module.exports = merge(common.baseConfig, {
    output: { //打包路径
        //filename: '[name].bundle.js', //出口文件名
        // filename: '[name].[chunkhash].js',
        // 可以使用__dirname变量获取当前模块文件所在目录的完整绝对路径
        path: __dirname + 'service/dist', //打包路径
        publicPath:'dist/', // 指定publicPath
        filename: '[name].bundle.js',
        library: manifest.name
    },
    devtool: 'source-map',
    devServer: {
        contentBase: [path.join(__dirname, './service')], // 本地服务器 加载页面 所在的目录
        host: '127.0.0.1',
        compress: true,
        port: 6600,
        open: false, // 将自动打开浏览器
        //服务器代理配置项
        //proxy: proxyArray
        proxy: {
            '/api':{
                //target:'http://demo.kube.univer/',
                target:proxy_target,  //用URL模块解析URL字符串
                // secure:true,
                changeOrigin: true, // 改变本地header的来源到目标URL
                ws: false // 是否使用 websockets
                /*
                //不显示/help
                pathRewrite: {
                    '^/help': ''
                }
                */
            }
        }
    },
    optimization: {
        minimize: false
    },
    plugins:[
        new webpack.HotModuleReplacementPlugin(), // 热加载的插件，使用缓存时请注释
        new BundleAnalyzerPlugin({
            analyzerMode: 'server', // static/disabled
            analyzerHost: '127.0.0.1',
            analyzerPort: 9900,
            openAnalyzer: false
        }),
        new webpack.DllReferencePlugin({
            context: __dirname,
            manifest: require('./service/dist/vendor-manifest.json')
        }),
    ]
});