Gulp、Grunt和Make(常见于c/cpp）、Ant、Maven、Gradle（Java/Android）、Rake、Thor（Ruby）一样，都是是Task Runner。用来将一些繁琐的task自动化并处理任务的依赖关系。
其中有些是基于配置描述的，描述逻辑比较费劲，比如Ant基于xml。还有些就是代码，比较灵活，个人偏好这种。比如Rake、Thor、Gulp、Gradle。对于Gradle来说也有些难搞。因为它本身是Groovy的DSL。如果要深入使用，你还得学一下Groovy语言。其他就好多了Rake、Thor就是写Ruby；Gulp就是JavaScript。相对门槛低很多。

2、模块化解决方案：

Browserify It provides a way to bundle CommonJS modules together, adheres to the Unix philosophy（小工具协作）, is in fact a good alternative to Webpack.
Webpack takes a more monolithic（整体解决、大而全） approach than Browserify... is relies on configuration.
webpack官网有对二者的使用方法进行对比，可以看一下： webpack for browserify users

3、Gulp应该和Grunt比较

Gulp / Grunt 是一种工具，能够优化前端工作流程。比如自动刷新页面、combo、压缩css、js、编译less等等。简单来说，就是使用Gulp/Grunt，然后配置你需要的插件，就可以把以前需要手工做的事情让它帮你做了。

4、webpack和gulp的区别

gulp是基于流的构建工具：all in one的打包模式，输出一个js文件和一个css文件，优点是减少http请求，万金油方案。
webpack是模块化管理工具，使用webpack可以对模块进行压缩、预处理、打包、按需加载等。

5、JS模块化的方案

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

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

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

这样就知道，Gulp是一个工具，而webpack等等是模块化方案。Gulp也可以配置seajs、requirejs甚至webpack的插件。

6、java做后端，前端使用gulp搭建，怎么部署呢？

后端是由java搭建的，现在前端的页面并不是由Gulp搭建，在学习gulp过程中，发现需要node.js，可是java的搭建是在其他环境，我用Gulp搭建和完成前端之后，怎么配合后端进行部署呢？

maven有个叫frontend.maven.plugin的插件可以完成node和bower install，npm install，npm run等命令，可以在package同时打包前台代码，最终和后端java一起打成一个war包。我们项目里就是这样做的。

另外再补充一点，如不用maven插件打成一个war的话（前后端工程解耦），也可以设2个有关联关系的jenkins project先后打包部署前端和后端。

7、devDependencies和dependencies的区别

区别是：
dependencies 程序正常运行需要的包。
devDependencies 是开发需要的包，比如一些单元测试的包之类的。
一个node package有两种依赖，一种是dependencies一种是devDependencies，
其中前者依赖的项该是正常运行该包时所需要的依赖项，
而后者则是开发的时候需要的依赖项，像一些进行单元测试之类的包。
如果将包下载下来在包的根目录里运行npm install默认会安装两种依赖，如果只是单纯的使用这个包而不需要进行一些改动测试之类的，可以使用npm install --production，只安装dependencies而不安装devDependencies。
如果是通过以下命令进行安装npm install packagename那么只会安装。dependencies，如果想要安装devDependencies，需要输入。npm install packagename --dev。

前端集成解决方案（webpack、gulp）

一、什么是前端集成解决方案

二、解决了前端哪些问题

三、常用的前端构建集成

1、Gulp

2、webpack

四、入门指南（红色标注重点推荐）

1、gulp