如何重命名在入口点之间共享的通用供应商块？

Question

我有Webpack设置，可以在普通供应商和各种入口点之间分割我的数据块。到目前为止，一切工作都很好，除了我有一个无法解决的问题，并且正在重命名一个特定的供应商数据块，其中包含我的入口点之间的共享模块。

我的node_modules核心，reactjs东西和redux有3个缓存组。所有其他共享节点模块都输出到一个名为vendors~client.dashboard~client.login.bundle.js的文件中。但是，我想将该块重命名为vendors~common.js，因为随着入口点的增加，我不需要很大的文件名。

我在下面粘贴了我的webpack配置。如您所见，我已经定义了缓存组，其他所有都很好。我只想知道如何重命名为其余共享节点模块自动生成的其余块。

const path = require("path");
const MiniCssExtractPlugin = require("mini-css-extract-plugin");
const devMode = process.env.NODE_ENV !== "production";
const webpack = require("webpack");
const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
const UglifyJsPlugin = require('uglifyjs-webpack-plugin');

module.exports = {
    name: "client",
    entry: {
        "client": ['@babel/polyfill', './src/exposers/client.js'],
        "client.login": './src/exposers/client.login.js',
        "client.dashboard": './src/exposers/client.dashboard.js'
    },
    output: {
        path: path.resolve(__dirname, './'),
        filename: 'assets/bundles/client/js/[name].bundle.js',
    },
    optimization: {
        splitChunks: {
            chunks: "all",
            cacheGroups: {
                core: {
                    test: /[\\/]node_modules[\\/](core-js|regenerator-runtime|scheduler|object-assign|@babel)[\\/]/,
                    name: "vendors~core",
                    chunks: "all",
                    enforce: true
                },
                react: {
                    test: /[\\/]node_modules[\\/](react|react-dom|prop-types)[\\/]/,
                    name: "vendors~react",
                    chunks: "all",
                    enforce: true
                },
                redux: {
                    test: /[\\/]node_modules[\\/](react-redux|redux)[\\/]/,
                    name: "vendors~redux",
                    chunks: "all",
                    enforce: true
                }
            }
        }
    },
    module: {
        rules: [{
                test: /\.jsx|js?$/,
                exclude: /node_modules/,
                use: {
                    loader: 'babel-loader'
                },
            }, {
                test: /\.css$/,
                use: [{
                        loader: MiniCssExtractPlugin.loader,
                        options: {
                            publicPath: path.resolve(__dirname, './')
                        }
                    },
                    "css-loader"
                ]
            },
            {
                test: /\.(png|jpg|gif|jpeg)$/i,
                use: [{
                    loader: 'file-loader',
                    options: {
                        name: '/[path][name].[ext]'
                    }
                }]
            }
        ],
    },
    plugins: [
        new BundleAnalyzerPlugin(),
        new MiniCssExtractPlugin({
            filename: "assets/bundles/client/css/[name].bundle.css"
        }),
        new webpack.ProvidePlugin({
            $: "jquery",
            jQuery: "jquery"
        })
    ],
    mode: "development",
    resolve: {
        extensions: ['.js', '.jsx'],
        alias: {
            "assets": path.resolve(__dirname, 'assets/'),
            "config": path.resolve(__dirname, 'config/'),
            "src": path.resolve(__dirname, 'src/'),
            "helpers": path.resolve(__dirname, 'src/helpers/'),
            "base": path.resolve(__dirname, 'src/components/base/'),
            "forms": path.resolve(__dirname, 'src/components/forms/'),
            "pages": path.resolve(__dirname, 'src/components/pages/'),
            "sections": path.resolve(__dirname, 'src/components/sections/'),
            "widgets": path.resolve(__dirname, 'src/components/widgets/'),
        }
    }
};