一杯茶的时间，带你区分gulp和webpack

前言☀️

• 对于刚毕业踏入社会的小白前端，在习惯了Vue脚手架完成业务功能后自带的webpack打包后对于打包的印象基本上就只有一个:npm run build
• 但是往往我们看招聘信息上面都有这么一行 有使用Gulp、Webpack等项目自动工程化经验者优先
• 这时候我们就去找两者的区别，听网上简单的描述就是 这两❓干的事情都一样呀不都是优化性能吗❓
• 说到自动化，也就是我们经常说的前端构建工具，因为构建工具就是用来让我们不做机械重复的事情，解放我们的双手，但其实gulp和webpack的定位不同，没有什么可比性就更别说是有冲突了，在翻阅了很多资料后打算在本文记录一下，如果有说的不对的地方欢迎大佬们在评论区指教~~~~😰

使用场景🏄

举几个简单的场景好理解一点

• 文件压缩
  我们知道文件如果越大，那么在浏览器下载或者打开的速度就会越慢，而对于css文件和js文件，里面的换行和空格只是方便我们开发者去阅读但是对于计算机来说都是一样的，所以如果我们减少空格和换行也可以减少文件大小。
• 文件合并
  我们一个网站肯定不止有一个js文件那么如果js文件越多，浏览器并发下载总的速度越慢，如果可以减少js文件数量是不是也可以加快速度呢？

当然还有我们开发经常遇到的很多场景和苦恼的地方，我们要解决这些问题包括图片大小之类的在之前都需要自己去压缩网站压缩但是有了自动化构建工具我们就可以提高我们开发效率让我们的注重点放在打代码上

gulp⌛️

• 正如官网所说 gulp将开发流程中让人痛苦