Как переименовать общий блок поставщика, разделенный между точками входа? - PullRequest
0 голосов
/ 14 февраля 2019

У меня есть настройка Webpack, чтобы разделить мои куски между распространенными поставщиками и различными точками входа.Пока все отлично работает, за исключением того, что у меня есть одна проблема, которую я не могу решить, это переименование определенного чанка поставщика, который содержит общие модули между моими точками входа.и избыточный.Все остальные модули общего узла выводятся в файл с именем, похожим на этот: vendors~client.dashboard~client.login.bundle.js.Тем не менее, я хотел бы переименовать этот чанк в vendors~common.js, потому что по мере того, как мои точки входа растут, я не хочу большого имени файла.

Я вставил свою конфигурацию веб-пакета ниже.Как видите, я определил свои группы кеша, а все остальное в порядке.Я просто хочу знать, как переименовать тот оставшийся кусок, который автоматически генерируется для остальной части модуля общего узла.

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/'),
        }
    }
};


Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...