gulp如果一个文件发生变化，则编译其余文件

Question

我正在使用gulp-watch来监视更改 而现在我忽略了布局文件。问题是每当我更新布局文件时，我都要更改其他文件以便编译。有没有办法使用gulp-watch观看所有内容然后编译它的一部分？我看到了这个relevant link，但它没有使用gulp-watch。

Answer 1

我误解了这个问题。无论如何，我在底部留下原始答案供参考。

您可以使用gulp-if。

 gulp.task('stream', function () {
    return gulp.src('dir/**/*.*')
        .pipe(watch('dir/**/*.*'))
        .pipe(gulpif(function (file) {
            return file.ext != ".layout"//your excluded extension
        }, processIfTrue()))
        .pipe(gulp.dest('build'));
});

该链接确实使用了gulp-watch。事实上，据我所知，该链接完全解释了您想要做什么。

gulp-watch以及您在更改时运行的任何任务都需要单独的gulp.src个实例。

例如，您可以使用gulp.src('**/*.*')作为gulp.watch，然后使用gulp.src('**/*.less')作为编译任务。

Answer 2

您可以设置2个单独的观察者来运行，并修改src中下面列出的每个相应文件将触发该文件名的相应任务：

$ tree -I node_modules
.
├── gulpfile.js
├── package.json
└── src
    ├── layout-file-1.html
    ├── layout-file-2.html
    ├── other-file-1.html
    └── other-file-2.html

1 directory, 6 files

gulpfile.js - gulp.watch()函数

var gulp = require('gulp')

// files with the word "layout" in them
var layoutFiles = 'src/**/*layout*';

// files without the word "layout" in them
var otherFiles = ['src/**/*', '!'+layoutFiles];

// these tasks will show as completed in console output
gulp.task('build-layout-files');
gulp.task('build-other-files');

gulp.task('watch', function(cb) {
   // watch only layoutFiles
   gulp.watch(layoutFiles, ['build-layout-files']) 

   // watch only otherFiles
   gulp.watch(otherFiles, ['build-other-files']) 
})

gulp.task('default', ['watch'])

gulpfile.js - gulp-watch module

var gulp = require('gulp')
var watch = require('gulp-watch')

// use print to debug watch processes
var print = require('gulp-print')

// files with the word "layout" in them
var layoutFiles = 'src/**/*layout*';

// files without the word "layout" in them
var otherFiles = ['src/**/*', '!'+layoutFiles];

gulp.task('watch:layout-files', function(cb) {
   watch(layoutFiles, function () {
      gulp.src(layoutFiles)
         .pipe(print(function(fileName) {
            return "Compiling Layout File: "+fileName;
         }))
         .pipe(gulp.dest('build/layout-files'))
   });
})

gulp.task('watch:other-files', function(cb) {
   watch(otherFiles, function () {
      gulp.src(otherFiles)
         .pipe(print(function(fileName) {
            return "Compiling Other File: "+fileName;
         }))
         .pipe(gulp.dest('build/other-files'))
   });
})

gulp.task('default', ['watch:layout-files', 'watch:other-files'])