[英]Print new messages whenever gulp-watch detects file change
I am using google-closure-compiler and gulp-watch to compile js files whenever any one of them is changed. 每当其中任何一个发生更改时,我都会使用google-closure-compiler和gulp-watch来编译js文件。
This is the code; 这是代码;
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'));
});
});
It works fine. 工作正常。 However, I would like to print new messages to the terminal when js files detected to have changed and re-compiled.
但是,当检测到js文件已更改并重新编译时,我想向终端打印新消息。 The new messages should provide information like this;
新消息应提供这样的信息;
1201hrs - file XXX was changed and recompiled
Any form of logging would be welcomed. 任何形式的日志记录都将受到欢迎。
Use gulp-changed-in-place , it only passes through source files that have changed. 使用gulp-changed-in-place ,它仅通过已更改的源文件。 gulp-logger is a basic stream logger.
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"));
});
Here is the modification required on your source code provided in the question. 这是问题中提供的对源代码进行的必要修改。 Credit goes to Dan Nagle who provided the tip on using
gulp-changed-in-place
and gulp-logger
. 丹·纳格尔(Dan Nagle)致谢,他提供了使用
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'));
});
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.