相信每个前端同学一定都使用过webpack，作为一个划时代的构建工具，却有很多同学对他的认识还停留在怎么改个host的认知上。由于现代的脚手架极大地提高了项目搭建的效率，但是工具的便捷性，自动化和完善的配置，也让很多同学对wepback认识不深。这里我整理了几个经典的场景的webpack应用，希望对大家有帮助
一、webpack的几个核心参数
作为铺垫，首先我们先介绍以下webpack的几个核心基本配置参数，也许懂的都懂，但是这里还是作为回顾和复习进行简单说明
1 entry
接受一个对象或数组，通过该配置，我们可以设定一个或者多个入口
2 output
接受一个对象,可以设置打包输出文件的输出路径及输出文件名。如果是多个入口的情况 可以使用[name]、[hash]等作为动态参数 设定多个输出文件的命名规则
3 plugins
一个数组，可以加载多个插件作为文件处理的。常用的插件如：
uglify-webpack-plugin:压缩 javascript
clean-webpack-plugin： 删除dist目录的文件
copy-webpack-plugin 复制文件
ExtractTextPlugin：将打包中的css单独抽离出来
HtmlWebpackPlugin：webpack打包后自动生成html页面
HappyPack： 多核打包 加快打包速度
CommonsChunkPlugin/SplitChunksPlugin : 抽取公用模块
webpack.DllPlugin+webpack.DllReferencePlugin 用与多入口项目 可以把入口的共同依赖 单独打包
4.module
通过设置module.rule数组来配置loader。loader一般通过正则表达式处理指定的文件类型，常用loader有
babel-loader @babel/core @babel/preset-env：JS转ES5的全家桶，需要配套使用
css-loader：解析import进来的.css文件
style-loader：把经过处理的css以