Почему не запускаетс сервер в Gulp4?

Question

[Андрей Dobrin]

Проблема такая:

Есть сборка

var gulp                = require('gulp'), 
      sass                 = require('gulp-sass'), 
      browserSync   = require('browser-sync'), 
      concat             = require('gulp-concat'),
      uglify              = require('gulp-uglifyjs'), 
      cssnano           = require('gulp-cssnano'), 
      rename           = require('gulp-rename'),
      del                  = require('del'), 
      imagemin       = require('gulp-imagemin'),
      pngquant        = require('imagemin-pngquant'),
      cache              = require('gulp-cache'), 
      autoprefixer    = require('gulp-autoprefixer');

gulp.task('sass', function() { 
    return gulp.src(['app/sass/**/*.sass', 'app/sass/**/*.scss']) 
        .pipe(sass()) 
        .pipe(autoprefixer(['last 15 versions', '> 1%', 'ie 8', 'ie 7'], { cascade: true })) 
        .pipe(gulp.dest('app/css'))
        .pipe(browserSync.reload({stream: true}))
});

gulp.task('browser-sync', function() { 
    browserSync.init({ 
        server: { 
            baseDir: 'app'
        },
        notify: false
    });
});

gulp.task('scripts', function() {
    return gulp.src([
        'app/libs/jquery/dist/jquery.min.js',
        'app/libs/magnific-popup/dist/jquery.magnific-popup.min.js'
        ])
        .pipe(concat('libs.min.js'))
        .pipe(uglify())
        .pipe(gulp.dest('app/js')); 
});

gulp.task('code', function() {
    return gulp.src(['app/*.html', 'app/pug/**/*.pug'])
    .pipe(browserSync.reload({ stream: true }))
});

gulp.task('css-libs', function() {
    return gulp.src('app/css/libs.css')
        .pipe(cssnano()) 
        .pipe(rename({suffix: '.min'})) 
        .pipe(gulp.dest('app/css'));
});

gulp.task('clean', async function() {
    return del.sync('dist'); 
});

gulp.task('img', function() {
    return gulp.src('app/img/**/*') 
        .pipe(cache(imagemin({ 
           .pipe(imagemin({
            interlaced: true,
            progressive: true,
            svgoPlugins: [{removeViewBox: false}],
            use: [pngquant()]
        })))
        .pipe(gulp.dest('dist/img')); 
});

gulp.task('prebuild', async function() {

    var buildCss = gulp.src([ 
        'app/css/main.css',
        'app/css/libs.min.css'
        ])
    .pipe(gulp.dest('dist/css'))

    var buildFonts = gulp.src('app/fonts/**/*')
    .pipe(gulp.dest('dist/fonts'))

    var buildJs = gulp.src('app/js/**/*') 
    .pipe(gulp.dest('dist/js'))

    var buildHtml = gulp.src('app/*.html')
    .pipe(gulp.dest('dist'));

});

gulp.task('clear', function (callback) {
    return cache.clearAll();
})

gulp.task('watch', function() {
    gulp.watch(['app/scss/**/*.sass', 'app/scss/**/*.scss'], gulp.parallel('sass'));
    gulp.watch(['app/*.html', 'app/pug/**/*.pug'], gulp.parallel('code'));
    gulp.watch(['app/js/*.js', 'app/libs/**/*.js'], gulp.parallel('scripts')); 
});

gulp.task('default', gulp.parallel('css-libs', 'sass', 'scripts', 'browser-sync', 'watch'));
gulp.task('build', gulp.parallel('prebuild', 'clean', 'img', 'sass', 'scripts'));

Собираюсь запускать gulp watch и мне в начале выдаёт

$ gulp watch
[09:52:21] Using gulpfile ~\******\******\Project\gulpfile.js
[09:52:21] Starting 'watch'...

Дальше ожидание.. и ничего не происходит. В чем может быть проблема?
Вышла новыя версия Gulp и я всё пропустил и пока не знаю ничего.
Спасибо за Ваш ответ)

Answer 1

[Volodimir Babeshko]

Так а может вначале нужно сервер запустить, а потом вотчер, а то у Вас вотчер таск сервера не запускает и мой совет, лучше все исходники держать в папке с исходника, а то у вас цсс генерируется в папку где лежат исходники (апп) и сервер из неё запускается, а собираете Вы в дист.