多线程打包:happypack

//模块happypack可以时间多线程(进程)来打包
//安装:npm install happypack
const happypack = require('happypack');

在配置文件webpack.config.js文件中,以前的加载js、css文件的使用方法如下:

module:{
    rules:[
        {test:/.js$/,
         use:{
                loader:'babel-loader',
                options:{
                    presets:[
                        //解析ES6和react语法
                        '@babel/preset-env',
                        '@babel/preset-react'
                    ]
                } 
            }
        }
     },
        {
            test:/.css$/,
            use:['style-loader','css-loader']
        }
    ]
 }

使用happypack后如下:

module:{
    rules:[
            {test:/.js$/,
             use:'happypack/loader?id=js'
            },
        {
            test:/.css$/,
            use:'happypack/loader?id=css'
        }
    ]
    },
    plugins: [
        new happypack({
            id:'css',
            use:['style-loader','css-loader']
        }),
        new happypack({
            id:'js',
            use:[{
                loader:'babel-loader',
                options:{
                    presets:[
                        //解析ES6和react语法
                        '@babel/preset-env',
                        '@babel/preset-react'
                    ]
                } 
            }]
        })
}
原文地址:https://www.cnblogs.com/zcy9838/p/11690080.html