我有 2 项任务:
- whitelabel - 我有一个 gulp 任务,它将给定的whitelabel 项目复制到文件夹中
- sass - 在该文件夹中编译 sass 项目
我的问题是,当我让它们在我的默认任务上按顺序运行时,CSS 文件被复制,但 sass 任务没有生成它应该生成的 css。但是,如果我运行一个任务而不是另一个任务,则会生成 css 文件。
我错过了什么?
白标任务
gulp.task('whitelabel', function() {
var argv = yargs.argv;
if (argv.whitelabel){
gulp.src('./whitelabels/_template/**/*')
.pipe(gulp.dest('./assets'));
return gulp.src('./whitelabels/'+ argv.whitelabel +'/**/*')
.pipe(gulp.dest('.'));
} else {
return gulp.src('./whitelabels/_template/**/*')
.pipe(del.sync(['./assets/']))
.pipe(gulp.dest('.'));
}
});
SASS 任务
gulp.task('sass', function() {
return gulp.src('assets/styles/style.scss')
.pipe($.sourcemaps.init())
.pipe($.sass({
style: 'expanded'
}))
.on('error', $.notify.onError({
title: 'SASS Failed',
message: 'Error(s) occurred during compile!'
}))
.pipe($.sourcemaps.write())
.pipe(gulp.dest('assets/styles'))
.pipe(reload({
stream: true
}))
.pipe($.notify({
message: 'Styles task complete'
}));
});
默认任务
gulp.task('default', ['config', 'browser-sync', 'whitelabel', 'sass', 'minify-css'], function() {
gulp.watch('whitelabels/_template/assets/styles/*.css', function(file) {
if (file.type === "changed") {
reload(file.path);
}
});
gulp.watch(['*.html', 'app/**/*.html', 'views/*.html'], ['bs-reload']);
gulp.watch(['whitelabels/_template/assets/js/*.js'], ['whitelabel','bs-reload']);
gulp.watch(['app/*.js'], ['bs-reload']);
gulp.watch('whitelabels/_template/assets/styles/**/*.scss', ['whitelabel', 'sass', 'minify-css']);
});
最佳答案
您的原始默认任务不保证任务按任何特定顺序运行 - 事实上它们是并行运行的。
很多人使用 run-sequence https://www.npmjs.com/package/run-sequence按指定顺序运行任务。
或者您可以通过
使“whitelabel”任务成为 sass 任务的依赖项gulp.task('sass', ['whitelabel'], function() {
关于javascript - Gulp 任务未按预期工作,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44147325/