vlambda博客
学习文章列表

嗨，我是你稳定更新的勾崽(｡･∀･)ﾉﾞ。

今天的主题是 Gulp。在前端工具百家争鸣的情况下，Gulp 依然占据一席之地，被 web 程序猿们爱不释手。

众所周知，Gulp 是基于流的自动化构建工具，而 Gulp 的作用就是将开发流程中让人痛苦或耗时的任务自动化，从而减少所浪费的时间、创造更大价值。

在这里出现了一个概念——自动化构建。

从语意上来讲，自动化指的是人类通过机器去代替手工完成一些工作。而构建可以理解为转换，把一个东西转换为另一个东西。

总的来说，开发行业中的自动化构建指的就是把我们开发阶段写出来的源代码自动转换为生产环境当中可以运行的代码或程序。

一般我们把这样的转化过程称之为自动化构建工作流，它的作用就是让我们尽可能脱离运行环境的种种问题。

如果你还不是很理解它的工作原理，请看下面这张图：

Gulp 就是扮演流水线中传送带的角色。在最开始的地方，传入一个空瓶，经过传送带的传送，程序猿们清洗空瓶，灌入液体药品，打上盖子，贴上标签等，一个完整的项目就出来了。

这样一说，Gulp 的功能就很清楚了，它就是在整个开发传输中起到传输的作用，功能性还得依赖开发者们。

明白了自动化构建的概念，我们还要知道什么是流。

看到流这个字，我们很容易就会联想到水流。水流有序且有方向，而 Gulp 中的流也是如此。

所以，Gulp 也可以被看作是一个管道，总而言之它就是一个传送的平台。

Gulp 是基于 Node.js 的，但是它并没有直接使用 Node.js 中 fs 模块里面的文件系统和流，而是包装了一层用来描述文件的简单的数据格式——vinyl。

通过 vinyl-fs 可以把 Node.js 原生的文件系统封装为 vinyl。这个封装让整个流的过程变得更加简单。由于 JavaScript 单线程的性质，使得流的加工过程要一个接一个地进行，这看起来更像是文件一个接一个地流过特定的管道。

看到这里，想必大家也就基本明白了 Gulp 这款基于流的自动化构建工具的作用了。再来看下 Gulp 官网上的描述：

• "Builds can be the most awful sinkhole for teams to waste their time with - gulp is a serious win for any project."

  对于团队而言，构建可能是浪费时间的最可怕的深渊。对于任何项目来说，gulp 都是一个重要的胜利。

可以看得出，开发者对于 Gulp 抱有很高的期望。事实上 Gulp 也确实是一款不错的构建工具。

它是基于内存实现的，也就是说它对于文件的处理环节都是在内存当中完成的，相对于磁盘读写，速度自然就快了很多。

Gulp 还默认支持同时处理多个任务，效率也就相对提高了很多，而且使用方式直观易懂，插件生态非常完善。目前插件数量已经达到了 4194 ，可以说是目前前端最流行的构建系统了。

总的来说，我们可以把 Gulp 看作是一根特殊的管道，而项目则是在这跟特殊的管道中流过的水，文件不断地流进流出，就形成了“读取文件 —> 修改文件 —> 写文件”这样的构建流程。

这样做的好处也是显而易见的，整个构建过程十分清晰，插件功能单一却更专一，对于灵活多变的需求可以更好地处理。目前 Gulp 已经更新到了 4.0.2，期待它带给我们更多的惊喜。

推荐阅读：

点个“赞”和“在看”就是对我最大的鼓励：）