你也可以使用gulp-streamify或gulp-stream将一个使用buffer的插件的输出转化为一个可读流。这样处理之后,跟在使用buffer的插件后面的(只能)使用流的插件也能正常工作了。
var wrap = require('gulp-wrap'), streamify = require('gulp-streamify'), uglify = require('gulp-uglify'), gzip = require('gulp-gzip'); gulp.src('app.js', {buffer: false}) .pipe(wrap('(function(){<%= contents %>}());')) .pipe(streamify(uglify())) .pipe(gulp.dest('build')) .pipe(gzip()) .pipe(gulp.dest('build')); 不是所有事都需要插件虽然已经有很多使用且方便的插件,很多任务以及转换可以不使用插件而轻易完成。插件会带来一些问题,你需要依赖一个额外的npm模块,一个插件接口和(反应迟钝?)的维护者,等等。如果一个任务可以不使用插件而使用原生模块就能轻易完成,绝大多数情况下,都建议不要使用插件。能够理解上面所说的概念,并能够在所处的情况下做出正确的决定,这点非常重要。下面来看一些例子:
vinyl-source-stream之前的例子中,我们已经直接使用了browserify,而不是使用(现已加入黑名单)gulp-browserify插件。这里的关键是使用vinyl-source-stream(或类似的库)进行加工,来将常规的可读流输入使用vinyl的插件。
文本转换另一个例子就是基于字符串的变换。这里有一个非常基础的插件,直接使用了vinyl的buffer:
function modify(modifier) { return through2.obj(function(file, encoding, done) { var content = modifier(String(file.contents)); file.contents = new Buffer(content); this.push(file); done(); }); }你可以像这样使用这个插件:
gulp.task('modify', function() { return gulp.src('app.js') .pipe(modify(version)) .pipe(modify(swapStuff)) .pipe(gulp.dest('build')); }); function version(data) { return data.replace(/__VERSION__/, pkg.version); } function swapStuff(data) { return data.replace(/(\w+)\s(\w+)/, '$2, $1'); }这个插件并没有完成,而且也不能处理流(完整版本)。然而,这个例子说明,可以很轻易地通过一些基本函数来创建新的变换。through2库提供了非常优秀的Node流封装,并且允许像上面那样使用转换函数。
任务流程如果你需要去运行一些定制化或动态的任务,了解gulp所使用的Orchestrator模块会很有帮助。gulp.add方法其实就是Orchestrator.add方法(事实上所有的方法都是从Orchestrator继承而来的)。但为什么你需要这个?
请注意,gulp(或grunt)并不总是当前情境下的最佳工具。比如说,如果你需要拼接并使用uglify压缩一系列的JavaScript文件,又或者你需要编译一些SASS文件,你可能需要考虑使用makefile或npm run,通过命令行来实现。减少依赖,减少配置,才是正解。
阅读通过npm run来实现任务自动化来了解更多信息。你需要明确通过一系列的“自定义构建”后需要得到什么,而哪个工具最合适。
不过,我觉得gulp是一个伟大的构建系统,我很喜欢使用它,它展现了Node.js中流的强大。
相关推荐
第一个gulp程序
说起来惭愧,一直用公司内部的工具,没有用这些红得发紫的东西。今天东抄西拼终于搞出第一个gulp应用。gulp是做什么的,好处在哪儿我不废话了。直入主题吧。 先在D盘下建立一个xxxx目录,然后打开控制台,直接将npm install gulp。 里面多出一个node_modules目录安装成功。 然后xxxx目录下面建一个src目录,里面建一个index.html文件,内容如下或你自己乱写一点东西
Gulp.js - 简单、直观的自动化项目构建工具
Gulp.js 是一个简单、直观的构建系统。崇尚代码优于配置,使复杂的任务更好管理。通过结合 NodeJS 的数据流的能力,你能够快速构建。通过简单的 API 接口,只需几步就能搭建起自己的自动化项目构建工具。 下面是一个简单的代码示例: var gulp = require('gulp'); var coffee = require('gulp-coffee'
Gulp.js 参考手册,自动化构建利器
Gulp 是最新的基于 Node 的自动化构建工具,希望能够取代 Grunt,成为最流行的 JavaScript 任务运行器。通过结合 NodeJS 的数据流的能力,只需几步就能搭建起自己的自动化项目构建工具。这里给大家分享一份很棒的 Gulp 速查手册。 速查手册1 速查手册2 本文链接:Gulp
Javascript高级技巧分享
上次整理了Ajax部分,这周看完了高级技巧部分,也整理下吧。 1、类型检测 使用Object.prototype.toString.call(obj)的方式。因为无论typeof还是instanceof都无法做到精确判断变量类型。2、安全的构造函数通常我们定义构造函数的时候,会使用类似 代码如下: function Person(name){ this.name = name; }
思维导图FreeMind
什么是MindMap? MindMap(被译成思维导图或心智图)是一种思维工具,由英国的记忆之父托尼-博赞发明。 MindMap是一种新的思维模式,它将左脑的逻辑、顺序、条例、文字、数字,以及右脑的图像、想像、颜色、空间、整体等各种因素全部调动起来,把一长串枯燥的信息变成彩色的、容易记忆的、有高度组织性的图,它绘制起来非常简单,而且十分有趣这样。利用MindMap不但可以增强思维能力,提升注意
JavaScript高级程序设计 学习笔记 js高级技巧
第十八章 高级技巧 1.高级函数 1.1 作用域安全的构造函数 ①直接调用构造函数而不适用new操作符时,由于this对象的晚绑定,它将映射在全局对象window上,导致对象属性错误增加到window。 代码如下: function Person(name,age,job){ this.name = name; this.age = age; this.job = job; } Var
批处理的高级运用技巧
批处理的高级运用1 一.简单批处理内部命令 批处理的高级运用!!小技巧哦!!! 批处理大家都很熟悉吧! 下面介绍批处理的几个知识点: 1:巧用FC命令做查木马工具: 首先建立批处理文件atm.bat:写入代码:@echooff dirc:\windows\system32\*.exe&g
.net中的正则表达式使用高级技巧
.net中的正则表达式使用高级技巧 (一) .net中的正则表达式使用高级技巧 (二) .net中的正则表达式使用高级技巧 (三) .net中的正则表达式使用高级技巧 (四)
五段实用的js高级技巧