typescript - Webpack 4 cache splitChunks så att de inte bearbetas varje gång

Jag har ett TypeScript-projekt som använder node-paket och webpack för att kompilera och paketera.

Min mappstruktur är;

Scripts
    App
        Various Modules
    Utility
        Various Utility components and helpers
    Index.tsx

Min webpack-konfiguration ser ut så här;

const path = require('path');
const nodeExternals = require('webpack-node-externals');

function srcPath(subdir) {
    return path.join(__dirname, 'Scripts', subdir);
}

config = {

    mode: 'development',

    entry: './Scripts/Index.tsx',

    output: {
        filename: 'scripts/js/bundle.js',
        path: __dirname + '/wwwroot'
    },

    // Enable sourcemaps for debugging webpack's output.
    devtool: 'source-map',

    resolve: {

        // resolve shortened import paths
        alias: {
            App: srcPath('App'),
            Utility: srcPath('Utility')
        },

        // Add '.ts' and '.tsx' as resolvable extensions.
        extensions: ['.ts', '.tsx', '.js', '.json']
    },

    module: {
        rules: [
            // All files with a '.ts' or '.tsx' extension will be handled by 'awesome-typescript-loader'.
            {
                test: /\.tsx?$/,
                exclude: /node_modules/,
                loader: 'ts-loader',
                options: {
                    transpileOnly: true
                }
            },

            // All output '.js' files will have any sourcemaps re-processed by 'source-map-loader'.
            { enforce: 'pre', test: /\.js$/, loader: 'source-map-loader' }
        ]
    },

    optimization: {
        minimize: false,
        splitChunks: {            
            cacheGroups: {
                vendor: {
                    test: /[\\/]node_modules[\\/]/,
                    name: 'vendor',
                    chunks: 'initial',
                    enforce: true
                }
            }
        }
    },

    target: 'web'
};

module.exports = config;

Detta genererar då 2 filer; bundle.js som är all min kod, och vendor.bundle.js som är alla node_packages komplierade och bundlade.

För närvarande tar detta i genomsnitt 9 sekunder att utföra sitt arbete. Detta är med projektet i sitt mycket tidiga skede. Min oro är att när projektet växer, kommer väntetiden att öka.

Finns det ett sätt att cacha vendor.bundle.js så att det inte kompileras och bundlas varje gång jag kör webpack?

Svar #1

Den första byggprocessen är långsam, men efterföljande inkrementella byggprocesser bör vara snabba. Så här fungerar webpack internt. Dessutom kan användning av en billigare source-map-byggstrategi avsevärt påskynda din byggprocess. Till exempel 'cheap-module-eval-source-map', devtool-alternativet. Du får originalkoden men bra inkrementell bygghastighet för lokal utveckling.