GULP:修改一个监视的文件,而不会造成无限循环 [英] GULP: Modify a watched file in place without causing an infinite loop
问题描述
const gulp = require('gulp');
$ b $ gulp.task('lint',function(){
return gulp.src('/ src / ** / *。js')
.pipe(jscs( {
fix:true
)))
.pipe(jscs.reporter())
.pipe(gulp.dest('/ src'));
});
$ b gulp.task('watch',function(){
gulp.watch('/ src / ** / *。js',['lint']);
});
重写源文件通常是个坏主意吞噬任务。这些文件打开的任何编辑器/ IDE可能会或可能无法正常处理。将文件写入单独的 dist
文件夹通常会更好。
这里有两种可能的解决方案: / p>
解决方案1
您需要停止 gulp -jscs
插件再次运行并再次写入文件,从而防止您遇到无限循环。要做到这一点,您只需添加 gulp-cached
> lint
任务:
var cache = require('gulp-cached');
$ b $ gulp.task('lint',function(){
return gulp.src('/ src / ** / *。js')
.pipe(cache( 'lint'))
.pipe(jscs({
fix:true
}))
.pipe(cache('lint'))
.pipe jscs.reporter())
.pipe(gulp.dest('/ src'));
});
第一个 cache()
确保只有自上次调用 lint
后发生更改的磁盘上的文件才会通过。第二个 cache()
确保只有实际被 jscs()
修复的文件写入磁盘第一个地方。
这个解决方案的缺点是 lint
任务仍然执行两次。这并不是什么大问题,因为在第二次运行期间,这些文件实际上并没有被分割。 gulp-cache
可以防止这种情况发生。但是,如果您绝对要确保 lint
只运行一次,那么还有其他方法。
解决方案2
首先,您应该使用 gulp-watch
插件而不是内置 gulp.watch()
(这是因为它使用了上级 chokidar
图书馆而不是 gaze
)。 p>
然后你可以写一个简单的 pausableWatch()
函数并在你的 watch
任务:
var watch = require('gulp-watch');
$ b函数pausableWatch(watchedFiles,tasks){
var watcher = watch(watchedFiles,function(){
watcher.close();
gulp.start(tasks ,function(){
pausableWatch(watchedFiles,tasks);
});
});
gulp.task('watch',function(){
pausableWatch('/ src / ** / *。js',['lint']);
});
在上面的观察者
之前停止 lint
任务开始。任何 .js
在 lint
任务中写入的文件都不会触发观察器
。 lint
任务完成后,观察者
再次启动。
这个解决方案的缺点是,如果在 lint
任务中保存 .js
文件,被执行的变化将不会被 watcher
拾取(因为它已被停止)。您必须在 lint
任务完成后(观察者时)保存
已经重新开始)。 .js
Im trying to use gulp and jscs to prevent code smell. I also want to use watch so that this happens when ever a change is made. The problem I'm running into is jscs is modify the source file that is being watched. This causes gulp to go into an infinite loop of jscs modifying the file and then watch seeing the change and firing off jscs again and again and again ...
const gulp = require('gulp');
gulp.task('lint', function() {
return gulp.src('/src/**/*.js')
.pipe(jscs({
fix: true
}))
.pipe(jscs.reporter())
.pipe(gulp.dest('/src'));
});
gulp.task('watch', function() {
gulp.watch('/src/**/*.js', ['lint']);
});
It's generally a bad idea to override source files from a gulp task. Any Editors/IDEs where those files are open might or might not handle that gracefully. It's generally better to write the files into a separate dist
folder.
That being said here's two possible solutions:
Solution 1
You need to stop the gulp-jscs
plugin from running a second time and writing the files again, thus preventing the infinite loop you're running into. To achieve this all you have to do is add gulp-cached
to your lint
task:
var cache = require('gulp-cached');
gulp.task('lint', function() {
return gulp.src('/src/**/*.js')
.pipe(cache('lint'))
.pipe(jscs({
fix: true
}))
.pipe(cache('lint'))
.pipe(jscs.reporter())
.pipe(gulp.dest('/src'));
});
The first cache()
makes sure that only files on disk that have changed since the last invocation of lint
are passed through. The second cache()
makes sure that only files that have actually been fixed by jscs()
are written to disk in the first place.
The downside of this solution is that the lint
task is still being executed twice. This isn't a big deal since during the second run the files aren't actually being linted. gulp-cache
prevents that from happening. But if you absolutely want to make sure that lint
is run only once there's another way.
Solution 2
First you should use the gulp-watch
plugin instead of the built-in gulp.watch()
(that's because it uses the superior chokidar
library instead of gaze
).
Then you can write yourself a simple pausableWatch()
function and use that in your watch
task:
var watch = require('gulp-watch');
function pausableWatch(watchedFiles, tasks) {
var watcher = watch(watchedFiles, function() {
watcher.close();
gulp.start(tasks, function() {
pausableWatch(watchedFiles, tasks);
});
});
}
gulp.task('watch', function() {
pausableWatch('/src/**/*.js', ['lint']);
});
In the above the watcher
is stopped before the lint
task starts. Any .js
files written during the lint
task will therefore not trigger the watcher
. After the lint
task has finished, the watcher
is started up again.
The downside of this solution is that if you save a .js
file while the lint
task is being executed that change will not be picked up by the watcher
(since it has been stopped). You have to save the .js
file after the lint
task has finished (when the watcher
has been started again).
这篇关于GULP:修改一个监视的文件,而不会造成无限循环的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!