Gulp:如何将参数从手表传递到任务
吞咽时,您经常会看到这样的模式:Gulp:如何将参数从手表传递到任务,gulp,gulp-watch,Gulp,Gulp Watch,吞咽时,您经常会看到这样的模式: gulp.watch('src/*.jade',['templates']); gulp.task('templates', function() { return gulp.src('src/*.jade') .pipe(jade({ pretty: true })) .pipe(gulp.dest('dist/')) .pipe( livereload( server )); }); 这是否真的将监视的文件
gulp.watch('src/*.jade',['templates']);
gulp.task('templates', function() {
return gulp.src('src/*.jade')
.pipe(jade({
pretty: true
}))
.pipe(gulp.dest('dist/'))
.pipe( livereload( server ));
});
这是否真的将监视的文件传递到模板任务中?这些是如何覆盖/扩展/过滤src'ed任务的?我不久前也有同样的问题,经过一段时间的挖掘,我得出了以下结论
gulp.watch
是一个发出change
事件的事件发射器,因此您可以执行以下操作:
var watcher = gulp.watch('src/*.jade',['templates']);
watcher.on('change', function(f) {
console.log('Change Event:', f);
});
你会看到:
Change Event: { type: 'changed',
path: '/Users/developer/Sites/stackoverflow/src/touch.jade' }
该信息可能通过其任务函数或gulp.src
的行为传递给模板
任务
任务函数本身只能接收回调(),不能接收有关gulp使用的乙烯基文件()的任何信息
启动任务的源(.watch,在本例中为.watch,或gulp命令行)对gulp.src('src-glob',[options])的行为没有影响。
'src-glob'
是一个字符串(或字符串数组),而options
()与任何文件更改无关
因此,我不认为.watch
会以任何方式直接影响它所触发的任务的行为
如果只想处理更改的文件,如果想使用gulp.watch
,或者冷用gulp-watch
,可以使用gulp-changed
()
或者,您也可以这样做:
var gulp = require('gulp');
var jade = require('gulp-jade');
var livereload = require('gulp-livereload');
gulp.watch('src/*.jade', function(event){
template(event.path);
});
gulp.task('templates', function() {
template('src/*.jade');
});
function template(files) {
return gulp.src(files)
.pipe(jade({
pretty: true
}))
.pipe(gulp.dest('dist/'))
}
将参数或数据从观察者传递到任务的一种可能方法。通过使用全局变量或两个块作用域中的变量,输入s。以下是一个例子:
gulp.task('watch', function () {
//....
//json comments
watch('./app/tempGulp/json/**/*.json', function (evt) {
jsonCommentWatchEvt = evt; // we set the global variable first
gulp.start('jsonComment'); // then we start the task
})
})
//global variable
var jsonCommentWatchEvt = null
//json comments task
gulp.task('jsonComment', function () {
jsonComment_Task(jsonCommentWatchEvt)
})
这里是做任务的函数,以防任何人感兴趣,但是我知道我不需要把工作放在另一个函数中,我可以直接在任务中实现它。对于文件,您有全局变量。这里是jsonCommentWatchEvt
。但是要知道,如果你没有像我那样使用函数,一个好的做法是将全局变量的值赋给一个你将要使用的局部变量。你可以在任务的最上面一个条目上这样做。因此,您将不会使用全局变量本身。这是为了避免问题,它可以改变另一个手表处理触发。当当前正在运行的任务仍在使用时
function jsonComment_Task(evt) {
console.log('handling : ' + evt.path);
gulp.src(evt.path, {
base: './app/tempGulp/json/'
}).
pipe(stripJsonComments({whitespace: false})).on('error', console.log).
on('data', function (file) { // here we want to manipulate the resulting stream
var str = file.contents.toString()
var stream = source(path.basename(file.path))
stream.end(str.replace(/\n\s*\n/g, '\n\n'))
stream.
pipe(gulp.dest('./app/json/')).on('error', console.log)
})
}
我有一个不同json文件的目录,我将在其中使用注释。我在看着他们。当文件被修改时,会触发监视处理,然后我只需要处理被修改的文件。为了删除注释,我使用了json注释条插件。另外,我需要做更多的治疗。删除多个连续换行符不管怎样,首先我需要传递文件的路径,我们可以从事件参数恢复该文件我通过一个全局变量将其传递给任务,这个全局变量只会这样做。允许传递数据。
注意:尽管这与问题无关,但在我这里的示例中,我需要处理从插件处理中流出的流。我在(“数据”
事件上使用了。它是异步的。因此任务将在工作完全结束之前标记结束(任务到达结束,但启动的异步函数将继续处理)。因此,您在任务结束时进入控制台的时间,不是整个处理的时间,而是任务块结束的时间。正如您所知。对我来说,这并不重要