我正在使用gulp@4
的多个文件,其中主要的gulpfile.js
包含./tasks/
目录中的所有其他文件。我们使用npm gulp-hub包将多个gulpfiles
包含在./tasks/
目录中。但是,当调用tasks
时,我们收到以下错误消息。
在使用前未定义前向引用的任务'clean-minify-js`
我们如何在主要的gulpfiles
中包含多个gulpfile.js
,以便我们可以调用tasks
?
目前gulpfile.js
:
'use strict';
var gulp = require('gulp'),
HubRegistry = require('gulp-hub');
var genericHub = new HubRegistry('./tasks/scripts.js');
gulp.registry(genericHub);
var watchers = function(done) {
gulp.watch('src/*.js', gulp.parallel('clean-minify-js'));
done();
}
gulp.task('watch', gulp.series(watchers));
目前./tasks/scripts.js
'use strict';
var gulp = require('gulp'),
clean = require('gulp-clean'),
uglify = require('gulp-uglify');
gulp.task('clean-scripts', function() {
return gulp.src(dest.js)
.pipe(clean({read:false, force: true});
});
gulp.task('minify-js', gulp.series('clean-scripts', function() {
gulp.src(src.js)
.pipe(uglify())
.pipe(gulp.dest(dest.js));
}));
gulp.task('clean-minify-js', gulp.series('minify-js'));
文件夹结构:
some/path/gulpfile.js
some/path/tasks/scripts.js
要解决这个问题,我必须做以下事情。
./tasks/
目录中的所有文件。[email protected]
设计的任务转换为gulp@4
的函数gulp.series
将函数设置为以我们需要的特定顺序运行gulpfile.js
'use strict';
var gulp = require('gulp'),
requireDir = require('require-dir');
requireDir('./tasks/');
var watchers = function(done) {
gulp.watch('src/*.js', gulp.parallel('clean-minify-js'));
done();
}
gulp.task('watch', gulp.series(watchers));
./tasks/scripts.就是
'use strict';
var gulp = require('gulp'),
clean = require('gulp-clean'),
uglify = require('gulp-uglify');
function cleanScripts() {
return gulp.src(dest.js)
.pipe(clean({read:false, force: true});
}
function minJs() {
return gulp.src(src.js)
.pipe(uglify())
.pipe(gulp.dest(dest.js));
}
gulp.task('clean-minify-js', gulp.series(cleanScripts, minJs));