First, Gulp/grunt is a building tool, can be combined with a variety of plugins do JS compression, CSS compression, less compiled or even automatically refresh the page to replace the manual implementation of these tedious work.
Second, Browserify/webpack and Seajs/requirejs are the same JS modular scheme. The two categories also differ:
- Seajs/requirejs: is an online "compile" module that is equivalent to loading a CMD/AMD interpreter on the page. In this way the browser knows define, exports, module these things. Modularity is also achieved.
- Webpack/browserify: is a pre-compiled module scheme, which is more intelligent than above. Here take Webpack as an example. First, it is precompiled and does not need to load the interpreter in the browser. In addition, you write in the local JS, regardless of the amd/cmd/es6 style of modularity, it can be recognized, and compiled into the browser to understand the JS.
Summary: Gulp/grunt belongs to Tools, while Webpack is a modular solution. Gulp can also configure Seajs, Requirejs, and even webpack plugins.
The relationship between Gulp/grunt and Browserify/webpack