在Visual Studio中保存一些javascript文件后自动运行gulp任务

Question

我的asp.net项目中有一个包含一些javascript文件的文件夹.在构建项目之前,将它们缩小并使用gulp复制到"wwwroot"文件夹.它工作得很好,但是当我对任何javascript文件进行一些更改时,我必须重新启动整个项目(运行与构建相关的任务)或从"Task Runner Explorer"手动运行任务.

这需要一些时间,这是非常恼人的.一旦我保存此文件夹中的任何javascript文件,它是否可以运行这些任务？

Answer 1

你应该用gulp.watch.我刚刚将一些构建脚本从Grunt迁移到Gulp,并希望提供相同的功能.

只需在Gulpfile中添加一个监视任务:

gulp.task('watch', function() {
    gulp.watch('/path/to/your/css/**/*.css', ['minifyCss']);
});

运行此任务后,gulp在任务完成后不会退出.相反,当文件更改时,将运行第二个参数中指定的任务.如果您不希望在文件更改时缩小所有CSS文件,则gulp-cached包将派上用场.它会过滤自上次运行任务以来未被修改的文件(在单个Gulp运行会话中,而不是在Gulp运行之间).只需gulp.src在任务中调用后添加它,它将过滤修改后的文件.

var cached = require('gulp-cached'),
    cssnano = require('gulp-cssnano');

gulp.task('minifyCss', function() {
    return gulp.src('/path/to/your/css/**/*.css')
        .pipe(cached('cssFiles'))
        .pipe(cssnano()) // or whatever plugin you use for minification
        .pipe(gulp.dest('./dist/'));
}

我确实尝试从VS Task Runner运行类似于这个的任务,但它不喜欢我的Gulpfile中使用的ES6功能,所以我不知道它是否能够正常运行任务.但是它从命令行按预期工作.