Webpack 和 gulp 的区别

---

首先 gulp 和 browserify / webpack 不是一回事

gulp应该和grunt比较。它们的区别就暂时不提了。gulp / grunt 是一种构建工具，能够优化前端的工程流，比如自动刷新页面，combo, 压缩css, js, 编译less等等。简单来说，就是使用gulp和grunt, 然后配置你需要的插件，就可以把以前需要手工做的事情让它帮你做了。

browserify / webpack，还有seajs / requirejs 这四个都是JS模块化的方案。其中seajs/ requirejs是一种类型， browserify / webpack 是另一种类型。

• seajs/ require: 是一种在线“编译”模块的方案，相当于在页面上加载一个CMD/AMD 解释器。这样浏览器就认识了 define、exports、module这些东西。也就实现了模块化。

• broserify / webpack: 是一个预编译模块的方案，相比于上面，这个方案更加智能。以webpack为例：首先它是预编译的，不需要再浏览器中加载解释器。另外，你在本地直接写JS, 不管是AMD / CMD / ES6 风格的模块化， 它都能认识。并且编译成浏览器认识的JS。

总结：gulp是一个工具，而webpack等等是模块化方案。gulp可以配置seajs、requirejs甚至webpack的插件。