gulp-watchがファイルの変更を検出したときに新しいメッセージを出力する

Question

jsファイルを変更するたびにjsファイルをコンパイルするためにgoogle-closure-compilerとgulp-watchを使用しています。

これはコードです。

var closureCompiler = require('google-closure-compiler').gulp(); 
var flatmap = require('gulp-flatmap');  
var watch = require('gulp-watch'); 

gulp.task('js-closure', function() { 
    return watch(['app/js/*.js', 'dist/single.js'], function() 
    { 
     gulp.src(['app/js/*.js', 'dist/single.js'], {base: './'}) 
      .pipe(flatmap(function(stream, file) { 
       return stream.pipe(closureCompiler({ 
        compilation_level: 'SIMPLE_OPTIMIZATIONS', 
        warning_level: 'QUIET', 
        language_in: 'ECMASCRIPT6_STRICT', 
        language_out: 'ECMASCRIPT5_STRICT', 
        output_wrapper: '(function(){\n%output%\n}).call(this)', 
        js_output_file: path.basename(file.path).replace(/js$/, 'min.js') 
       })) 
      })) 
      .pipe(gulp.dest('./dist/js')); 
    }); 
}); 

正常に動作します。しかし、jsファイルが変更され再コンパイルされたことが検出されたときに、新しいメッセージを端末に出力したいと思います。新しいメッセージはこのような情報を提供するはずです。

1201hrs - file XXX was changed and recompiled

ログの任意の形は歓迎されるだろう。

Answer 1

gulp-changed-in-placeを使用すると、変更されたソースファイルのみが通過します。 gulp-loggerは基本ストリームロガーです。

var gulp = require("gulp"), 
    changedInPlace = require("gulp-changed-in-place"), 
    logger = require("gulp-logger"); 

gulp.task("default", function() { 
    return gulp.src("app/js/**/*.js") 
    .pipe(changedInPlace()) 
    // the pipe now contains the files 
    // that have changed since the last run 
    .pipe(logger({ 
     before: "Closure compiler task", 
     after: "Compiling complete!", 
     showChange: true 
    })) 
    // your own gulp task goes here 


    // then pipe to the destination 
    .pipe(gulp.dest("./dist/js")); 
}); 

Answer 2

ここでは、質問に記載されているソースコードに必要な変更があります。ダンナーグルは、gulp-changed-in-placeとgulp-loggerを使用してヒントを提供しました。

var closureCompiler = require('google-closure-compiler').gulp(); 
var flatmap = require('gulp-flatmap'); 
var watch = require('gulp-watch'); 
var changedInPlace = require("gulp-changed-in-place"); 
var logger = require("gulp-logger"); 

gulp.task('js-closure', function() { 
    return watch(['app/js/*.js', 'dist/single.js'], function() 
    { 
     gulp.src(['app/js/*.js', 'dist/single.js'], {base: './'}) 
      .pipe(changedInPlace()) 
      .pipe(flatmap(function(stream, file) { 
       return stream.pipe(closureCompiler({ 
        compilation_level: 'SIMPLE_OPTIMIZATIONS', 
        warning_level: 'QUIET', 
        language_in: 'ECMASCRIPT6_STRICT', 
        language_out: 'ECMASCRIPT5_STRICT', 
        output_wrapper: '(function(){\n%output%\n}).call(this)', 
        js_output_file: path.basename(file.path).replace(/js$/, 'min.js') 
       })) 
      })) 
      .pipe(logger({ 
       before: "file was changed", 
       after: "file has been recompiled", 
       showChange: true 
      })) 
      .pipe(gulp.dest('./dist/js')); 
    }); 
});