Gulp与Node.js:剖析最豪的软件项目build系统

  首先需要解释的是什么是一个build系统:

  一个build系统也被称为一个通用的任务执行器,对于重复执行的任务,进行自动化,标准化执行。

  这些重复性的任务可以是任意工作任务,包括编译前的预处理工作任务,例如对css和Java的处理,同时也包括一些类似部署过程的处理任务等等。

  同时需要注意的是build 系统通常会与其他工具协同工作,比如:包管理器(package manager),我们按照build的阶段,解读下,这个工作流程,通常会涉及到哪些工具的集成应用。

  现代化的build系统通常包括三个核心组件:包管理器(Package Managers) ,预处理器(Preprocessors),任务执行器和相关工具(Task Runners & Build Tools).

  包管理器 - 负责自动安装,升级,和删除相关的依赖模块包,包括模块包和模块库。

  常见的包管理器主要包括两个: BOWER和Node.js使用的NPM包管理器,所以对于新手来说,通常会为在什么情况下使用Bower或NPM感觉困惑,简单的理解是你用BOWER来管理通用的依赖模块,比如jQuery,AngularJS,Backbone等等,而npm则用在非js的环境下,通常包括你常常使用的一些工具模块,通常会用在build的生成阶段,例如Gulp,Bower等。

  而在预处理阶段,我们会用到的包括SASS等来对css进行预处理,而对于java我们会用到Coffee和Type,对于HTML我们会用到HAML,Jade,Markdown,和Slim.

  预处理阶段非常重要,是形成高效build工作流程的关键,在这个阶段我们会充实更多的功能特性和优化语法等等以达到不断优化转为本地代码的效率和质量。

  预处理阶段,使用的技术,大多数工作经验高于三年的人,都会比较熟悉了,例如Coffee,Haml等等。

  现在我们分析下任务运行器,这个阶段,我们经常用的工具包括:Gulp和Grunt.这两款工具都可以运行在Node.js环境下,两款工具使用方法和内部结构类似。

  我们看一下Gulp常用的语法代码片段:

  var gulp=require('gulp');

  var uglify=require('gulp-uglify');

  //上面的代码首先就是声明,会用到的相关模块,接下来,就可以执行build任务,例如:

  gulp.task('s',function(){

  //code

  });

  通常我们会在任务里处理类似对图片进行压缩,复制文件,或启动部署过程。

  后面我们就会使用类似这样的命令来进行执行上面的工作任务:

  gulp s

  接下来,我们还可以声明另外一个常用的工作任务:

  gulp.task('watch',function(){

  gulp.watch('app/js/**/*.js',['s']);

  });

  watch任务的作用就是对一组给定的文件进行监控,如果发现这些文件发生改变,就会执行第二个参数中指定的工作任务。

  此外我们通常还会定义default工作任务,也就是默认执行的工作任务,例如:

  gulp.task('default',['s','watch']);

  当你在命令行窗口执行gulp但是没有指定具体工作任务的时候,就执行默认的任务,而且这些任务列表里的任务都是在相同的时间,异步执行的。

  事实上,默认的执行模式,在后面你可以进行覆盖,改变默认的执行默认。

  现在我们讨论下是使用gulp还是grunt!

  这里需要明确的是,这两款工具本质上都是做一样的工作,因此具体使用哪种工具,对结果产生不了任何不同的影响,但是很多人都认为gulp在特别的几个方面要优秀于grunt!

  grunt更大,使用到的组件更多,因此学习周期可能会更长,如果是新手的话,同时gulp看来变的越来越普及,根据社区信息,google也在开始使用gulp,因为gulp更容易学习和使用,因此也更容易维护,例如你丢下gulp的项目三个月,再回头接着处理的时候,不会感觉太困难,因为它的确相对非常简单,容易梳理。

  相反的如果你使用grunt,如果你去维护三个月之前的项目,你会发现你因为遗忘了很多重要的信息,而变得对grunt 项目无从下手,事实上,这种情况发生在每个程序员身上,无论是否具备丰富的项目经验。

  之所以有这样的差别,是因为grunt使用了巨量的配置文件,而gulp则使用了结构清晰,利于维护的代码编写。

  很显然维护繁多的配置信息,与维护一段简洁,逻辑清晰的代码,哪种更有效率,结果是不言自明的。

  另外一个使用gulp的原因是,gulp要比grunt快,这是因为它使用了流技术,而grunt则选用的是文件,这样gulp在读写方面明显更加具备优势,另外gulp采取了异步的方式,这样可以获得更大的并发处理性能。

  本文作者微信公众号 elearn007欢迎关注交流!

  文章欢迎转载,欢迎交流,欢迎关注,一起交换经验,交换知识储备,学习资源等等!

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章