升级到Gulp 4后,实时重新加载不起作用
我的gulpfile.js如下所示升级到Gulp 4后,实时重新加载不起作用,gulp,gulp-watch,gulp-connect,Gulp,Gulp Watch,Gulp Connect,我的gulpfile.js如下所示 var gulp = require('gulp'); var pug = require('gulp-pug'); var sass = require('gulp-sass'); var minifyCSS = require('gulp-csso'); var concat = require('gulp-concat'); var sourcemaps = require('gulp-sourcemaps'); var connect = requir
var gulp = require('gulp');
var pug = require('gulp-pug');
var sass = require('gulp-sass');
var minifyCSS = require('gulp-csso');
var concat = require('gulp-concat');
var sourcemaps = require('gulp-sourcemaps');
var connect = require('gulp-connect');
gulp.task('connect', function () {
connect.server({
root: 'build',
livereload: true,
port: 3000
});
});
gulp.task('html', function () {
return gulp.src('client/html/**/*.pug')
.pipe(pug({
pretty: true
}))
.pipe(gulp.dest('build'))
.pipe(connect.reload())
});
gulp.task('css', function () {
return gulp.src(['node_modules/bootstrap/scss/bootstrap.scss', 'client/scss/*.scss'])
.pipe(sass({ outputStyle: 'compressed' }))
.pipe(gulp.dest('build/css'))
.pipe(connect.reload())
});
gulp.task('images', function () {
return gulp.src(['client/assets/**/*.*'])
.pipe(gulp.dest('build/assets'))
.pipe(connect.reload())
});
gulp.task('js', function () {
return gulp.src('client/javascript/*.js')
.pipe(sourcemaps.init())
.pipe(concat('app.min.js'))
.pipe(sourcemaps.write())
.pipe(gulp.dest('build/js'))
.pipe(connect.reload())
});
gulp.task('watch', gulp.parallel('html', 'css', 'js'));
gulp.task('default', gulp.series('connect', 'watch', 'html', 'css', 'images', 'js'));
当我运行这段代码时,我在控制台上并没有得到任何错误,但在浏览器上也不会自动重新加载。我在以前版本的Gulp中做得很好,但不知怎的,我无法在Gulp4中运行它。现在,每当我停止服务器时,我都会发现以下错误
[18:44:35] The following tasks did not complete: default, connect
[18:44:35] Did you forget to signal async completion?
任何帮助都将不胜感激。谢谢尝试将连接函数更改为显式调用done();我想在gulp4中调用series()时需要这个
gulp.task('connect', function (done) {
connect.server({
root: 'build',
livereload: true,
port: 3000
});
done();
});
您好,您能解释一下您的代码是如何解决这个问题的吗?大多数gulp插件都在src和dest方法之间运行。Dest:创建用于将乙烯基对象写入文件系统的流。您必须侦听流才能完成任务。
gulp.task('html', (done) =>
gulp.src('client/html/**/*.pug')
.pipe(pug({
pretty: true
}))
.pipe(gulp.dest('build'))
.on('end', () => {
connect.reload();
done();
});
);