Webpack 4 множественных набора записей с разделением кода, уникальным для каждого - PullRequest
Новая
       31

Webpack 4 множественных набора записей с разделением кода, уникальным для каждого

0 голосов
/ 11 июня 2018

Допустим, есть приложение с несколькими сгенерированными сервером страницами, каждая со старым базовым «одностраничным приложением».Например, Настройки (/ settings) - это собственный SPA.Foo это свое собственное (/ foo).То же самое с Баром, Куксом и Фоксом по их собственным URL.Они не взаимодействуют друг с другом, но мне бы хотелось разделить код, чтобы каждый пакет SPA не был раздут одинаковыми сторонними разработчиками.

Конфигурация Webpack может выглядеть следующим образом: 

module.exports = {
    entry: {
        settings: './js/settings.js',
        foo: './js/foo.js',
        bar: './js/bar.js',
        qux: './js/qux.js',
        fox: './js/fox.js'
    },
    optimization: {
        splitChunks: {
            cacheGroups: {
                commons: {
                    test: /[\\/]node_modules[\\/]/,
                    minChunks: 2,
                    name: "vendors",
                    chunks: "all"
                }
            }
        }
    },
    output: {
        path: path.join(__dirname, 'dist'),
        filename: '[name].js',
        sourceMapFilename: '[name].map'
    },
}
* 1005.Однако я не хочу делить один и тот же пакет «вендоров», поскольку, как вы можете себе представить, эти пять старых SPA имеют очень большой граф зависимостей, в котором почти нет тех же глубин, что и в Hot, и я не хочу в Hotчтобы избавиться от этого раздувания.Если я добавлю свойство к entry, как hot: './js/hot.js', и ранее только 1 из старых комплектов использовал d3, а теперь и мой горячий комплект, d3 будет разделен по кодам на комплект поставщиков.Но это то, чего я не хочу.Кроме того, если позже я добавлю Кроме того, с тем же deps, что и в Hot, многие из них, теперь эти два будут извлечены в поставщика?

Нужны ли мне две совершенно разные конфигурации веб-пакетов для выполнения отдельных пакетов с разделением кода (без необходимостиявно сказать, какие депы должны идти в каждом)?По сути, я думаю, что-то вроде: 

module.exports = {
    entry: [{
        settings: './js/settings.js',
        foo: './js/foo.js',
        bar: './js/bar.js',
        qux: './js/qux.js',
        fox: './js/fox.js'
    }, {
        hot: './js/hot.js',
        alsoHot: './js/alsoHot.js'
    }],
    // rest is the same
}
...