webpack多进程打包

当前端项目变得很大时，无论是编译还是打包构建都会非常的久，因为js是单进程单线程的，因此webpack也是单进程，这也导致当需要编译的文件很多时会很久，要解决编译打包速度慢的问题，我们就可以采用多进程打包的方案。

使用方式

我们需要下载以下loader来为webpack实现多进程

npm i thread-loader -D

在webpack打包中，babel的代码编译阶段是最久的，因此，我们基本都是给babel开启多进程，至于其他环节就没什么太大的必要了。

// webpack.config.js
module.exports = {
    module: {
        rules: [
            {
                test: /\.js$/,
                use: [
                    // 使用多进程打包
                    {
                      	loader: 'thread-loader',
                        options: {
                            workers: 8 // 开启8条进程打包
                        }
                    },
                    {
                        loader: 'babel-loader',
                        options: {
                            presets: [
                                '@babel/preset-env',
                                {
                                    useBuiltIns: true,
                                    corejs: 3,
                                    targets: {
                                        ie: 8,
                                        chrome: 55
                                    }
                                }
                            ]
                        }
                    }
                ]
            }
        ]
    }
}

至此，我们的多进程打包配置就完成了。

优缺点

优点：

需要编译的文件很多时，能显著提高打包的速度。

缺点：

如果需要编译的文件比较少，则会拖慢整体的打包速度。