webpack優化系列-多進程打包thread-loader

項目變的龐大，文件很多的情況下，采取多進程打包

• 如果小項目，文件不多，無需開啟多進程打包，反而會變慢，因為開啟進程是需要花費時間的

多進程打包：

1 安裝 thread-loader
npm i thread-loader -D

配置如下：

    module.exports = {
      entry: './src/js/index.js',
      output: {
        filename: 'js/built.[contenthash:10].js',
        path: resolve(__dirname, 'build')
      },
      module: {
        rules: [
              {
                test: /\.js$/,
                exclude: /node_modules/,
                use: [
                  /* 
                    開啟多進程打包。 
                    進程啟動大概為600ms，進程通信也有開銷。
                    只有工作消耗時間比較長，才需要多進程打包
                  */
                  {
                    loader: 'thread-loader',
                    options: {
                      workers: 2 // 進程2個
                    }
                  },
                  {
                    loader: 'babel-loader',
                    options: {
                      presets: [
                        [
                          '@babel/preset-env',
                          {
                            useBuiltIns: 'usage',
                            corejs: { version: 3 },
                            targets: {
                              chrome: '60',
                              firefox: '50'
                            }
                          }
                        ]
                      ],
                      // 開啟babel緩存
                      // 第二次構建時，會讀取之前的緩存
                      cacheDirectory: true
                    }
                  }
                ]
              }
        ]
      }