我有第一项任务:
gulp.task( 'sass', function() {
gulp.src('src/sass/**/*.+(sass|scss)')
.pipe( sass({
outputStyle:'expanded'
}).on( 'error', notify.onError(
{
message: "<%= error.message %>",
title : "Sass mistake!"
} ) )
)
.pipe(gulp.dest('src/css'));
});
第二名:
gulp.task('optimize:css', ['sass'], function () {
setTimeout(function () {
gulp.src('src/css/styles.css')
.pipe(
postcss([
autoprefix({
browsers:['>2%']
}),
stylelint(config),
stylefmt(config)
])
)
.pipe(gulp.dest('dev/assets/css'))
.pipe(cssmin())
.pipe(rename({suffix: '.min'}))
.pipe(gulp.dest('dev/assets/css'));
},1000)
});
在第二个任务中,我使用setTimeout,因为如果我在没有它的情况下运行optimize:css
,任务将在异步和优化中执行:css&#39;不会给我正确的结果
有没有办法使用一个任务而不是两个,没有超时,我会得到相同的结果。
答案 0 :(得分:0)
您可以在Gulp documentation中找到任务依赖关系定义的示例。
在你的情况下,它看起来像这样:
// Notice "cb" argument here
gulp.task('sass', function (cb) {
gulp.src('src/sass/**/*.+(sass|scss)')
.pipe(sass({
outputStyle: 'expanded'
}).on('error', notify.onError(
{
message: "<%= error.message %>",
title: "Sass mistake!"
}))
)
.pipe(gulp.dest('src/css'))
// And a fact that it is called at the end of the task
.on('end', cb);
});
gulp.task('optimize:css', ['sass'], function () {
gulp.src('src/css/styles.css')
.pipe(
postcss([
autoprefix({
browsers: ['>2%']
}),
stylelint(config),
stylefmt(config)
])
)
.pipe(gulp.dest('dev/assets/css'))
.pipe(cssmin())
.pipe(rename({suffix: '.min'}))
.pipe(gulp.dest('dev/assets/css'));
});