Webpack 4缓存splitChunks，这样就不会每次都处理它们

Question

我有一个TypeScript项目，它使用node包和webpack来编译和捆绑。

我的文件夹结构是；

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

我的webpack配置是这样的；

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;

这将生成两个文件：bundle.js是我的所有代码，vendor.bundle.js是所有node_packages编译和捆绑的文件。

目前，这平均需要9秒来完成它的工作。这是由于该项目处于非常早期的阶段。我担心的是，随着项目的增长，等待时间将会增加。

有没有一种方法可以缓存vendor.bundle.js，使其在每次运行webpack时都不会被编译和打包

Answer 1

第一次构建很慢，但后续的增量构建应该很快。这就是webpack在内部的工作方式。此外，使用更便宜源代码映射构建策略可以显著加快构建进度。例如‘便宜模块-求值-源-映射’，devtool option。您可以获得原始源，但本地开发的增量构建速度很快。