Gulp 通知全局成功函数
Gulp Notify global success function
我希望有 gulp-notify 成功调用的函数,我可以重复使用它。我对我的所有任务都使用相同的格式,并且想清理它。这是我现在正在做的一个例子:
gulp.task('build-css', function() {
const s = gsize();
return gulp.src('src/css/main.css')
.pipe(plumber({ errorHandler: onError }))
.pipe(cssmin())
.pipe(rename({suffix: '.min'}))
.pipe(gulp.dest('dist/css'))
.pipe(s)
.pipe(notify({
title: function () {
return '<%= file.relative %> - ' + s.prettySize;
},
onLast: true,
subtitle: "Successfully Compiled",
message: "@ Time: <%= options.hour %>:<%= options.minute %>:<%= options.second %> ",
templateOptions: {
hour: new Date().getHours(),
minute: new Date().getMinutes(),
second: new Date().getSeconds()
}
}))
});
我在多个任务中重复使用同一个通知函数。我试过做这样的事情,但每次尝试都会引发错误。此特定错误与水管工有关 - Can't Pipe to Undefined
var onSuccess = function () {
const s = gsize();
notify({
title: function () {
return '<%= file.relative %> - ' + s.prettySize;
},
onLast: true,
subtitle: "Successfully Compiled",
message: "@ Time: <%= options.hour %>:<%= options.minute %>:<%= options.second %> ",
templateOptions: {
hour: new Date().getHours(),
minute: new Date().getMinutes(),
second: new Date().getSeconds()
}
})
};
...
gulp.task('build-css', function() {
const s = gsize();
return gulp.src('src/css/main.css')
.pipe(plumber({ errorHandler: onError }))
.pipe(autoprefixer({
browsers: ['last 6 versions'],
cascade: false
}))
.pipe(cssmin())
.pipe(rename({suffix: '.min'}))
.pipe(s)
.pipe(onSuccess())
.pipe(gulp.dest('dist/css'))
.pipe(reload({stream: true}));
});
如有任何关于如何实现这一点的想法,我们将不胜感激!
编辑 在 qballers 解决方案之后,唯一的问题是我的 gulp-size 插件返回未定义的文件大小:
const s = gsize();
// Success Message
var notifyGeneric = {
title: function () {
return '<%= file.relative %> - ' + s.prettySize;
},
onLast: true,
subtitle: "Successfully Compiled",
message: "@ Time: <%= options.hour %>:<%= options.minute %>:<%= options.second %> ",
templateOptions: {
hour: date.getHours(),
minute: date.getMinutes(),
second: date.getSeconds()
}
};
...
gulp.task('build-css', function() {
const s = gsize();
return gulp.src(srcCssPath + 'main.css')
.pipe(plumber({ errorHandler: onError }))
.pipe(autoprefixer({
browsers: ['last 6 versions'],
cascade: false
}))
.pipe(cssmin())
.pipe(rename({suffix: '.min'}))
.pipe(s)
.pipe(notify(notifyGeneric))
.pipe(gulp.dest(cssPath))
.pipe(reload({stream: true}));
});
不确定这是否是您想要的解决方案,但您可以只使用对象文字来避免代码重复。
var notifyGeneric = {
title: function () {
return '<%= file.relative %> - ' + this.s.prettySize;
},
onLast: true,
subtitle: "Successfully Compiled",
message: "@ Time: <%= options.hour %>:<%= options.minute %>:<%= options.second %> ",
templateOptions: {
hour: new Date().getHours(),
minute: new Date().getMinutes(),
second: new Date().getSeconds()
},
s: {}
};
gulp.task('build-css', function() {
notifyGeneric.s = gsize();
return gulp.src('src/css/main.css')
.pipe(plumber({ errorHandler: onError }))
.pipe(cssmin())
.pipe(rename({suffix: '.min'}))
.pipe(gulp.dest('dist/css'))
.pipe(notifyGeneric.s)
.pipe(notify(notifyGeneric))
});
我希望有 gulp-notify 成功调用的函数,我可以重复使用它。我对我的所有任务都使用相同的格式,并且想清理它。这是我现在正在做的一个例子:
gulp.task('build-css', function() {
const s = gsize();
return gulp.src('src/css/main.css')
.pipe(plumber({ errorHandler: onError }))
.pipe(cssmin())
.pipe(rename({suffix: '.min'}))
.pipe(gulp.dest('dist/css'))
.pipe(s)
.pipe(notify({
title: function () {
return '<%= file.relative %> - ' + s.prettySize;
},
onLast: true,
subtitle: "Successfully Compiled",
message: "@ Time: <%= options.hour %>:<%= options.minute %>:<%= options.second %> ",
templateOptions: {
hour: new Date().getHours(),
minute: new Date().getMinutes(),
second: new Date().getSeconds()
}
}))
});
我在多个任务中重复使用同一个通知函数。我试过做这样的事情,但每次尝试都会引发错误。此特定错误与水管工有关 - Can't Pipe to Undefined
var onSuccess = function () {
const s = gsize();
notify({
title: function () {
return '<%= file.relative %> - ' + s.prettySize;
},
onLast: true,
subtitle: "Successfully Compiled",
message: "@ Time: <%= options.hour %>:<%= options.minute %>:<%= options.second %> ",
templateOptions: {
hour: new Date().getHours(),
minute: new Date().getMinutes(),
second: new Date().getSeconds()
}
})
};
...
gulp.task('build-css', function() {
const s = gsize();
return gulp.src('src/css/main.css')
.pipe(plumber({ errorHandler: onError }))
.pipe(autoprefixer({
browsers: ['last 6 versions'],
cascade: false
}))
.pipe(cssmin())
.pipe(rename({suffix: '.min'}))
.pipe(s)
.pipe(onSuccess())
.pipe(gulp.dest('dist/css'))
.pipe(reload({stream: true}));
});
如有任何关于如何实现这一点的想法,我们将不胜感激!
编辑 在 qballers 解决方案之后,唯一的问题是我的 gulp-size 插件返回未定义的文件大小:
const s = gsize();
// Success Message
var notifyGeneric = {
title: function () {
return '<%= file.relative %> - ' + s.prettySize;
},
onLast: true,
subtitle: "Successfully Compiled",
message: "@ Time: <%= options.hour %>:<%= options.minute %>:<%= options.second %> ",
templateOptions: {
hour: date.getHours(),
minute: date.getMinutes(),
second: date.getSeconds()
}
};
...
gulp.task('build-css', function() {
const s = gsize();
return gulp.src(srcCssPath + 'main.css')
.pipe(plumber({ errorHandler: onError }))
.pipe(autoprefixer({
browsers: ['last 6 versions'],
cascade: false
}))
.pipe(cssmin())
.pipe(rename({suffix: '.min'}))
.pipe(s)
.pipe(notify(notifyGeneric))
.pipe(gulp.dest(cssPath))
.pipe(reload({stream: true}));
});
不确定这是否是您想要的解决方案,但您可以只使用对象文字来避免代码重复。
var notifyGeneric = {
title: function () {
return '<%= file.relative %> - ' + this.s.prettySize;
},
onLast: true,
subtitle: "Successfully Compiled",
message: "@ Time: <%= options.hour %>:<%= options.minute %>:<%= options.second %> ",
templateOptions: {
hour: new Date().getHours(),
minute: new Date().getMinutes(),
second: new Date().getSeconds()
},
s: {}
};
gulp.task('build-css', function() {
notifyGeneric.s = gsize();
return gulp.src('src/css/main.css')
.pipe(plumber({ errorHandler: onError }))
.pipe(cssmin())
.pipe(rename({suffix: '.min'}))
.pipe(gulp.dest('dist/css'))
.pipe(notifyGeneric.s)
.pipe(notify(notifyGeneric))
});