webpack和gulp的区别的话，我是这么理解的：
gulp是个自动化构建的工具，gulp所做的工作就是对指定文件的代码进行压缩合并或者资源打包，所以我一般会在自己的个人项目规模不是很大的时候使用gulp来构建，完了在页面中引用就行了，这样子的目的就是单纯的减小文件体积；
- 我们需要配置一个entry指明执行入口，找到每个文件所依赖的文件，递归下去，在解析文件递归的过程中根据文件类型和loader配置找出合适的loader用来对文件进行转换，并将最后递归得到的结果根据entry配置生成代码块chunk，然后输出chunk到文件系统
- 我们引用了比较多的第三方库，那如果将这些类库在页面中分别引用，请求页面的时候，可能浏览器要发起多次请求，但是可能每一次的请求都是一小段的js代码或者很小的图片，本身可能才几k左右，下载可能只要1秒，但是http请求发送之前我们得先建立tcp连接，tcp的三握四挥消耗的时间比下载资源本身还要长，所以如果我们把这些文件都打包成一个文件，那么只进行一次tcp握手和挥手的过程，但是相应的结果是下载了多个资源，他们共享同一个http请求，让页面加载更快，用户体验更佳，这部分就是可以减少页面请求时间
- 而且针对于第三方库，像Vue或者React这种体系库会包含有像其对应的状态管理库和路由管理库，这个时候webpack就可以让我们抽出这些基础库到一个单独的文件而不是和其他文件放在一起打包为一个文件，这样做的好处就是即便我们不去升级他们的版本就永远不会被刷新，但是如果我们把他们这些基础库和业务代码打包在一个文件里每次改动业务代码都会导致文件hash值变化紧接着导致浏览器缓存失效，那浏览器就会重复下载这些包含基础库的代码，所以这部分的话我们就可以利用webpack做代码分割的优化
当然webpack也不止这些功能，他也有诸多插件，比如热加载呀，自动刷新呀都是很方便的。