Gulp Web服务器任务和监视任务不能一起工作

Gulp Web服务器任务和监视任务不能一起工作,gulp,gulp-watch,Gulp,Gulp Watch,这里我有一个监视任务,它将根据我的src创建我的build目录。我的build目录将包含两个名为debug和release的主要子目录。“监视”任务将查看我的src目录(我的工作目录)的内部,并将src中适当格式的文件传输到release和debug目录中。现在我还有一个Web服务器任务,使用gulp-webserver(实时重新加载)包来查看调试目录中的index.html文件。我的问题是每个任务都是独立工作的,但我不知道如何同时运行它们。这是我尝试过的,但没有成功(只有一个会启动)。如果需要

这里我有一个监视任务,它将根据我的
src
创建我的
build
目录。我的
build
目录将包含两个名为
debug
release
的主要子目录。“监视”任务将查看我的src目录(我的工作目录)的内部,并将src中适当格式的文件传输到
release
debug
目录中。现在我还有一个Web服务器任务,使用
gulp-webserver
(实时重新加载)包来查看调试目录中的
index.html
文件。我的问题是每个任务都是独立工作的,但我不知道如何同时运行它们。这是我尝试过的,但没有成功(只有一个会启动)。如果需要更多信息,请告诉我

// watch
gulp.task('watch',()=>{
    gulp.watch(pathJS,gulp.series('js','js-min'));
    gulp.watch(pathSCSS,gulp.series('sass','sass-min'));
    gulp.watch(['src/**/*.*','!'+pathJS,'!'+pathSCSS],gulp.series('cp','cp-min'));
});
// webserver
gulp.task('webserver',()=>{
    gulp.src(buildOptions.debugPath)
        .pipe(webServer({
            fallback: 'index.html',
            port:'4000',
            livereload:true,
            open:true
        }))
});
.
.
.
var default_tasks = ['build', 'webserver', 'watch'];
gulp.task('default',gulp.series('clean',...default_tasks));
编辑: 这是我完整的
gulpfile.js

const gulp = require('gulp');
const uglify = require('gulp-uglify-es').default;
const sass = require('gulp-sass');
const del = require('del');
const webServer = require('gulp-webserver');
//-------------------------------------------------------------------------------------------------
const build_tasks=['js','js-min','sass','sass-min','cp','cp-min'];
const buildOptions={
    releasePath:'build/release/',
    debugPath:'build/debug/',
};
const pathJS = 'src/js/**/*.js'
const pathSCSS = 'src/style/**/*.scss'
//-------------------------------------------------------------------------------------------------
// JavaScript Task
gulp.task('js',()=>{
    return gulp.src([pathJS])
            .pipe(gulp.dest(buildOptions.debugPath+'/js/'));
});
gulp.task('js-min',()=>{
    return gulp.src([pathJS])
            .pipe(uglify().on('error',uglify=>console.error(uglify.message)))
            .pipe(gulp.dest(buildOptions.releasePath+'/js/'));
})
// sass Task
gulp.task('sass',()=>{
    return gulp.src([pathSCSS])
            .pipe(sass().on('error',sass.logError))
            .pipe(gulp.dest(buildOptions.debugPath+'/style/'));
});
gulp.task('sass-min',()=>{
    return gulp.src([pathSCSS])
            .pipe(sass({outputStyle: 'compressed'}).on('error',sass.logError))
            .pipe(gulp.dest(buildOptions.releasePath+'/style/'))

})
// copy files
gulp.task('cp',()=>{
    return gulp.src(['src/**/*.*','!'+pathJS,'!'+pathSCSS])
        .pipe(gulp.dest(buildOptions.debugPath));
});
gulp.task('cp-min',()=>{
    return gulp.src(['src/**/*.*','!'+pathJS,'!'+pathSCSS])
            .pipe(gulp.dest(buildOptions.releasePath));
});
// watch
gulp.task('watch',()=>{
    gulp.watch(pathJS,gulp.series('js','js-min'));
    gulp.watch(pathSCSS,gulp.series('sass','sass-min'));
    gulp.watch(['src/**/*.*','!'+pathJS,'!'+pathSCSS],gulp.series('cp','cp-min'));
});
// webserver
gulp.task('webserver',()=>{
    gulp.src(buildOptions.debugPath)
        .pipe(webServer({
            fallback: 'index.html',
            port:'4000',
            livereload:true,
            open:true
        }))
});
//-------------------------------------------------------------------------------------------------
gulp.task('clean',function(){return del(['build']);});
gulp.task('build',gulp.parallel(...build_tasks));
//-------------------------------------------------------------------------------------------------
function build(){
    var default_tasks = ['build', 'webserver', 'watch'];
    //var default_tasks = ['build', 'watch'];
    gulp.task('default',gulp.series('clean',...default_tasks));
}
build();

我通过对
webserver
watch
任务使用
gulp.parallel
来解决问题:

// watch
gulp.task('watch',()=>{
    gulp.watch(pathJS,gulp.series('js','js-min'));
    gulp.watch(pathSCSS,gulp.series('sass','sass-min'));
    gulp.watch(['src/**/*.*','!'+pathJS,'!'+pathSCSS],gulp.series('cp','cp-min'));
});
// webserver
gulp.task('webserver',()=>{
    gulp.src(buildOptions.debugPath)
        .pipe(webServer({
            fallback: 'index.html',
            port:'4000',
            livereload:true,
            open:true
        }))
});
.
.
.
gulp.task('default',gulp.series('clean','build',gulp.parallel('webserver', 'watch')));//Here is my change!

您应该包括清理和构建任务。你有返回语句吗?表示完成。@标记,等待您的响应。请看我的编辑