默认情况下,在 stream 中发生一个错误的话,它会被直接抛出,除非已经有一个时间监听器监听着 error
时间。 这在处理一个比较长的管道操作的时候会显得比较棘手。
这里是一个在 gulpfile 中使用它的例子:
var combiner = require(‘stream-combiner2‘); var uglify = require(‘gulp-uglify‘); var gulp = require(‘gulp‘); gulp.task(‘test‘, function() { var combined = combiner.obj([ gulp.src(‘bootstrap/js/*.js‘), uglify(), gulp.dest(‘public/bootstrap‘) ]); // 任何在上面的 stream 中发生的错误,都不会抛出, // 而是会被监听器捕获 combined.on(‘error‘, console.error.bind(console)); return combined; });
最好的一个选择就是使用一个原生的 node 模块。
$ npm install --save-dev gulp del
假想有如下的文件结构:
.
├── dist
│ ├── report.csv
│ ├── desktop
│ └── mobile
│ ├── app.js
│ ├── deploy.json
│ └── index.html
└── src
在 gulpfile 中,我们希望在运行我们的编译任务之前,将 mobile
文件的内容先清理掉:
var gulp = require(‘gulp‘); var del = require(‘del‘); gulp.task(‘clean:mobile‘, function (cb) { del([ ‘dist/report.csv‘, // 这里我们使用一个通配模式来匹配 `mobile` 文件夹中的所有东西 ‘dist/mobile/**/*‘, // 我们不希望删掉这个文件,所以我们取反这个匹配模式 ‘!dist/mobile/deploy.json‘ ], cb); }); gulp.task(‘default‘, [‘clean:mobile‘]);
你可能需要在管道中将一些处理过的文件删除掉。
我们使用 vinyl-paths 模块来简单地获取 stream 中每个文件的路径,然后传给 del
方法。
$ npm install --save-dev gulp del vinyl-paths
假想有如下的文件结构:
.
├── tmp
│ ├── rainbow.js
│ └── unicorn.js
└── dist
var gulp = require(‘gulp‘); var stripDebug = require(‘gulp-strip-debug‘); // 仅用于本例做演示 var del = require(‘del‘); var vinylPaths = require(‘vinyl-paths‘); gulp.task(‘clean:tmp‘, function () { return gulp.src(‘tmp/*‘) .pipe(stripDebug()) .pipe(gulp.dest(‘dist‘)) .pipe(vinylPaths(del)); }); gulp.task(‘default‘, [‘clean:tmp‘]);
只有在已经使用了其他的插件之后才需要这样做,否则,请直接使用 gulp.src
来代替。
在做增量编译打包的时候,有一个比较麻烦的事情,那就是你常常希望操作的是 所有 处理过的文件,而不仅仅是单个的文件。举个例子,你想要只对更改的文件做代码 lint 操作,以及一些模块封装的操作,然后将他们与其他已经 lint 过的,以及已经进行过模块封装的文件合并到一起。如果不用到临时文件的话,这将会非常困难。
使用 gulp-cached 以及 gulp-remember 来解决这个问题。
var gulp = require(‘gulp‘); var header = require(‘gulp-header‘); //给文本文件头部追加内容 var footer = require(‘gulp-footer‘); var concat = require(‘gulp-concat‘); var jshint = require(‘gulp-jshint‘); //js代码校验 var cached = require(‘gulp-cached‘); var remember = require(‘gulp-remember‘); //gulp-remember
is a gulp plugin that remembers files that have passed through it.gulp-remember
adds all the files it has ever seen back into the stream. var scriptsGlob = ‘src/**/*.js‘; gulp.task(‘scripts‘, function() { return gulp.src(scriptsGlob) .pipe(cached(‘scripts‘)) // 只传递更改过的文件 A temp file based caching proxy task for gulp. .pipe(jshint()) // 对这些更改过的文件做一些特殊的处理... .pipe(header(‘(function () {‘)) // 比如 jshinting ^^^ .pipe(footer(‘})();‘)) // 增加一些类似模块封装的东西 .pipe(remember(‘scripts‘)) // 把所有的文件放回 stream .pipe(concat(‘app.js‘)) // 做一些需要所有文件的操作 .pipe(gulp.dest(‘public/‘)); }); gulp.task(‘watch‘, function () { var watcher = gulp.watch(scriptsGlob, [‘scripts‘]); // 监视与 scripts 任务中同样的文件 watcher.on(‘change‘, function (event) { if (event.type === ‘deleted‘) { // 如果一个文件被删除了,则将其忘记 delete cached.caches.scripts[event.path]; // gulp-cached 的删除 api remember.forget(‘scripts‘, event.path); // gulp-remember 的删除 api } }); });
// npm install gulp gulp-mocha var gulp = require(‘gulp‘); var mocha = require(‘gulp-mocha‘); gulp.task(‘default‘, function() { return gulp.src([‘test/test-*.js‘], { read: false }) .pipe(mocha({ reporter: ‘spec‘, globals: { should: require(‘should‘) } })); });
// npm install gulp gulp-mocha gulp-util var gulp = require(‘gulp‘); var mocha = require(‘gulp-mocha‘); var gutil = require(‘gulp-util‘); gulp.task(‘mocha‘, function() { return gulp.src([‘test/*.js‘], { read: false }) .pipe(mocha({ reporter: ‘list‘ })) .on(‘error‘, gutil.log); }); gulp.task(‘watch-mocha‘, function() { gulp.watch([‘lib/**‘, ‘test/**‘], [‘mocha‘]); });
默认情况下,每次运行时候所有的文件都会传递并通过整个管道。通过使用 gulp-changed 可以只让更改过的文件传递过管道。这可以大大加快连续多次的运行。
// npm install --save-dev gulp gulp-changed gulp-jscs gulp-uglify var gulp = require(‘gulp‘); var changed = require(‘gulp-changed‘); var jscs = require(‘gulp-jscs‘); var uglify = require(‘gulp-uglify‘); // 我们在这里定义一些常量以供使用 var SRC = ‘src/*.js‘; var DEST = ‘dist‘; gulp.task(‘default‘, function() { return gulp.src(SRC) // `changed` 任务需要提前知道目标目录位置 // 才能找出哪些文件是被修改过的 .pipe(changed(DEST)) // 只有被更改过的文件才会通过这里 .pipe(jscs()) .pipe(uglify()) .pipe(gulp.dest(DEST)); });
// npm install --save-dev gulp gulp-if gulp-uglify minimist var gulp = require(‘gulp‘); var gulpif = require(‘gulp-if‘); var uglify = require(‘gulp-uglify‘); var minimist = require(‘minimist‘); var knownOptions = { string: ‘env‘, default: { env: process.env.NODE_ENV || ‘production‘ } }; var options = minimist(process.argv.slice(2), knownOptions); gulp.task(‘scripts‘, function() { return gulp.src(‘**/*.js‘) .pipe(gulpif(options.env === ‘production‘, uglify())) // 仅在生产环境时候进行压缩 .pipe(gulp.dest(‘dist‘)); });
$ gulp scripts --env development
原文:http://www.cnblogs.com/myzy/p/6265910.html