Webpack v4 - Миграция с CommonsChunkPlugin на SplitChunksPlugin

Я с трудом пытаюсь понять, как перенести настройки Webpack с v3 на v4 с помощью SplitChunksPlugin. Способ, которым я настроил это раньше, был таким:

webpack.mix.js

...
entry: {
    main: mainJsEntry,
},
plugins: [
    new webpack.optimize.CommonsChunkPlugin({
        names: ["main"],
        filename: 'js/[name].js',
        minChunks: Infinity
    })
],
...

global.js

const Vue = require('vue'); // this ends up in global.js
const myModule = require('global/mymodule.js'); // this is imported into global.js

page1.js

const Vue = require('vue'); // this references global.js
const anotherLibrary = require('anotherLibrary'); // this is imported into page1.js

page2.js

const myModule = require('global/mymodule.js'); // this references global.js
const anotherLibrary = require('anotherLibrary'); // this is imported into page2.js

Я пытаюсь сделать так, чтобы все комплекты Javascript, кроме global.js, ссылались на существующий импорт из global.js, но не связывали ни один модуль, который не был импортирован внутри самого global.js.

Следуя документации по Webpack v4, я могу только заставить Webpack связать все, что я импортирую более одного раза в другие модули, в global.js, но я этого не хочу. Случай использования будет, если я хочу карусель на двух страницах, я бы импортировал на каждой странице, но я не хочу, чтобы это глобально, так как он используется на 2 из 100+ страниц на сайте.

...
optimization: {
    splitChunks: {
        cacheGroups: {
            commons: {
                name: 'global',
                filename: 'js/corp/global.js',
                chunks: 'all',
                minChunks: 2
            }
        }
    }
},
...

Я надеюсь, что то, что я надеюсь сделать, ясно. Любая помощь приветствуется.

0 ответов

Другие вопросы по тегам