Создание JS-пакетов более мелких поставщиков с помощью Webpack 4 путем исключения - PullRequest
Новая
       6

Создание JS-пакетов более мелких поставщиков с помощью Webpack 4 путем исключения

0 голосов
/ 14 ноября 2018

Пытаюсь сжать мои файлы JS.Уже используется terser, что значительно помогает, но app.js составляет около 600 КБ, manifest.js - 4 КБ, а vendor.js - 2,5 МБ.Я пытаюсь разделить поставщика на более мелкие пакеты.

Мой подход состоит в том, чтобы разделить vendor.js на более мелкие части - это поместить React, Redux и React Router в один reactVendor.js.Другие библиотеки, которые я использую в utilityVendor.js.Тогда оставшиеся зависимости просто в vendor.js.(app.js и manifest.js останутся без изменений).

Это моя конфигурация ниже, и она не работает.Он не создает vendor.js, а помещает все остальное в app.js, чего я определенно не хочу.

Я в основном пытаюсь создать reactVendor.js и utilityVendor.js, затем все, что угодноне в тех, положить в vendor.js: 

optimization: {
    minimizer: [new TerserPlugin()],
    runtimeChunk: {
        name: 'manifest'
    },
    splitChunks: {
        cacheGroups: {
            reactVendor: {
                test: /[\\/]node_modules[\\/](react|react-dom|react-router-dom|react-router-hash-link|react-redux|react-router-redux|redux|redux-form|redux-thunk)[\\/]/,
                name: 'reactVendor',
                chunks: 'all',
                enforce: true
            },
            utilityVendor: {
                test: /[\\/]node_modules[\\/](axios|bootstrap|file-saver|lodash|moment|react-dropzone|reactstrap)[\\/]/,
                name: 'utilityVendor',
                chunks: 'all',
                enforce: true   
            },
            vendor: {
                test: /[\\/]node_modules[\\/]!(react|react-dom|react-router-dom|react-router-hash-link|react-redux|react-router-redux|redux|redux-form|redux-thunk|axios|bootstrap|file-saver|lodash|moment|react-dropzone|reactstrap)[\\/]/,
                name: 'vendor',
                chunks: 'all',
                enforce: true
            },
        }
    }
},

Более того, я также пытаюсь добавить @react-pdf/renderer в utilityVendor.js, а '/' вызывает проблемы с регулярным выражением.Не уверен, как справиться с этим.

...