Разделение кода в Webpack, добавление флаговых глобальных файлов в разделение кода без импорта - PullRequest
Новая
       23

Разделение кода в Webpack, добавление флаговых глобальных файлов в разделение кода без импорта

0 голосов
/ 24 декабря 2018

У меня есть несколько точек входа в веб-пакет (14), которые объединяются и разделяются по кодам с помощью splitChunks, minChunks: 2.Все они полагаются на некоторые глобальные CSS.Я хочу, чтобы глобальный CSS был включен в комплект, но было бы глупо добавить операторы импорта для файлов CSS в 2 местах, чтобы вызвать splitChunks.

Есть ли способ сообщить веб-пакет или мини-пакет?css-extract для включения css-файлов непосредственно в пакет с разделением кода?Не имея import css вверху двух файлов?В идеале это будет похоже на include: [file1.css, file2.css], а файлы в массиве будут добавлены в пакет shared.css с кодовым разделением.Вероятно, будет более хакерским решением, хотя: (

module: {
    rules: [
        {
            test: /\.jsx?$/,
            exclude: [/node_modules/, /readme/, /scss/],
            loaders: 'happypack/loader'
        },
        {
            test: /\.(scss|css)$/,
            exclude: [/tools/, /utils/],
            use: [
                MiniCssExtractPlugin.loader,
                {
                    loader: 'css-loader',
                    options: {
                        sourceMap: true
                    }
                },
                {
                    loader: 'sass-loader',
                    options: {
                        sourceMap: true
                    }
                },
                {
                    loader: 'sass-resources-loader',
                    options: {
                        resources: ['./scss/partials/_colors.scss']
                    }
                }
            ]
        },
    ]
},
optimization: {
    removeAvailableModules: false,
    removeEmptyChunks: false,
    splitChunks: {
        cacheGroups: {
            commons: {
                chunks: 'all',
                minChunks: 2,
                name: 'shared'
            }
        }
    }
},
plugins: [
    new HappyPack({
        loaders: ['cache-loader', 'babel-loader?cacheDirectory=true&sourceMaps=true', 'eslint-loader'],
        threads: 4
    }),

    new MiniCssExtractPlugin({
        filename: './[name].css?[hash]'
    }),
...