Изоляция общих модулей

Question

У меня есть две страницы page1.html и page2.html.Каждый из них использует свои собственные файлы сценариев page1.js и page2.js.Я собираю их с помощью вебпака с таким конфигом

module.exports = {
    mode: "development",
    entry: {
        page1: "./src/page1.js",
        page2: "./src/page2.js"
    },
    output: {
        path: './dist',
        filename: '[name]-bundle.js'
    }
}

Все работает.Выходные данные - это два файла page1-bundle.js и page2-bundle.js, которые подключены к страницам через <script>

Теперь я хочу, чтобы общие библиотеки, использующие page1.js и page2.js (например, jQuery) длявыделиться в одном common.js файле.Чтобы клиент не загружал один и тот же код с двух страниц, а использовал кеш браузера.Есть ли способ сделать это?

optimization: {
    splitChunks: {
        chunks: 'all'
    }
}

Это создает еще два файла vendors~[name]-bundle.js, и клиент все еще должен загрузить все

Единственное, что мне пришло в голову, было создатьСобственно common.js, переместите все общие импорты из pageX.js (и удалите импорт из самих файлов) и добавьте третью точку входа в конфигурацию.

Это так?Есть ли более цивилизованный путь?