运行 gulp 命令一个接一个的结果不同于 运行 它们在 gulp.series 中的输出。为什么?
Running gulp commands one by one results in different output than running them in gulp.series. Why?
下面是我的 gulp 文件。我正在尝试从 scss 生成缩小的 css,然后使用 gulp-rev 重命名它。 运行 gulp clean:assets 然后 gulp scss 然后 gulp css 完美运行。但是 运行 gulp build 没有完成任务。缩小后的 css 存储在 ./assets/css 中,但重命名后的 css 未存储在 ./public/assets
中
const gulp = require('gulp');
//gulp sass converts sass to css
const sass = require('gulp-sass');
//cssnano converts css to minified form
const cssnano = require('gulp-cssnano');
//rev renames the assets by appending content hash to filenames so that the browser treats it as a new asset if content is changed
const rev = require('gulp-rev');
const path = require('path');
const del = require('del');
gulp.task('clean:assets', function(done){
del.sync('./public/assets');
del.sync('./assets/css');
done();
});
gulp.task('scss', function(done){
gulp.src('./assets/scss/**/*.scss')
.pipe(sass())
.pipe(cssnano())
.pipe(gulp.dest('./assets/css'))
done();
});
gulp.task('css', function(done){
gulp.src('./assets/css/**/*.css', {base: path.join(process.cwd(), 'assets')})
.pipe(rev())
.pipe(gulp.dest('./public/assets/'))
.pipe(rev.manifest('public/assets/rev-manifest.json',{
base: process.cwd()+'./public/assets',
merge: true
}))
.pipe(gulp.dest('./public/assets'));
done();
});
gulp.task('build', gulp.series('clean:assets', 'scss', 'css'), function(done){
done();
})
gulp.task('scss', ()=> {
return new Promise((resolve, reject) => {
return gulp.src('./assets/scss/**/*.scss')
.pipe(sass())
.pipe(cssnano())
.pipe(gulp.dest('./assets/css'))
.on('end', resolve)
.on('error', reject);
});
});
将 scss 任务更改为以上以使其正常工作。参考
下面是我的 gulp 文件。我正在尝试从 scss 生成缩小的 css,然后使用 gulp-rev 重命名它。 运行 gulp clean:assets 然后 gulp scss 然后 gulp css 完美运行。但是 运行 gulp build 没有完成任务。缩小后的 css 存储在 ./assets/css 中,但重命名后的 css 未存储在 ./public/assets
中const gulp = require('gulp');
//gulp sass converts sass to css
const sass = require('gulp-sass');
//cssnano converts css to minified form
const cssnano = require('gulp-cssnano');
//rev renames the assets by appending content hash to filenames so that the browser treats it as a new asset if content is changed
const rev = require('gulp-rev');
const path = require('path');
const del = require('del');
gulp.task('clean:assets', function(done){
del.sync('./public/assets');
del.sync('./assets/css');
done();
});
gulp.task('scss', function(done){
gulp.src('./assets/scss/**/*.scss')
.pipe(sass())
.pipe(cssnano())
.pipe(gulp.dest('./assets/css'))
done();
});
gulp.task('css', function(done){
gulp.src('./assets/css/**/*.css', {base: path.join(process.cwd(), 'assets')})
.pipe(rev())
.pipe(gulp.dest('./public/assets/'))
.pipe(rev.manifest('public/assets/rev-manifest.json',{
base: process.cwd()+'./public/assets',
merge: true
}))
.pipe(gulp.dest('./public/assets'));
done();
});
gulp.task('build', gulp.series('clean:assets', 'scss', 'css'), function(done){
done();
})
gulp.task('scss', ()=> {
return new Promise((resolve, reject) => {
return gulp.src('./assets/scss/**/*.scss')
.pipe(sass())
.pipe(cssnano())
.pipe(gulp.dest('./assets/css'))
.on('end', resolve)
.on('error', reject);
});
});
将 scss 任务更改为以上以使其正常工作。参考