Gulp v4 смотреть задание - PullRequest
Новая
       48

Gulp v4 смотреть задание

0 голосов
/ 30 августа 2018


Я только что обновился до Gulp v4, и мне было интересно, почему мой gulpfile больше не работает.
Я попробовал новый код новой документации, но он не сработал, как планировалось, потому что я использую "чистый" postcss.
Так что я погуглил свою проблему и нашел этот вопрос: Ошибка глотка: задача наблюдения должна быть функцией
Тем не менее, это также не является решением для моей проблемы, хотя я получаю то же сообщение об ошибке Error: watching src/styles/**/*.scss: watch task has to be a function

У меня сейчас есть этот код 

var gulp = require('gulp');
var sass = require('gulp-sass');
var postcss = require('gulp-postcss');
var autoprefixer = require('autoprefixer');
var cssnano = require('cssnano');

gulp.task('default', function () {
    gulp.watch('src/styles/**/*.scss', ['styles']);
});

gulp.task('styles', function () {
    var processors = [
        autoprefixer({
            browsers: ['last 3 versions', 'ie > 9']
        }),
        cssnano()
    ];
    gulp.src('src/styles/main.scss')
        .pipe(sass().on('error', sass.logError))
        .pipe(postcss(processors))
        .pipe(gulp.dest('dist/files/styles/'));
});

и когда я меняюсь
gulp.watch('src/styles/**/*.scss', ['styles']);
до
gulp.watch('src/styles/**/*.scss', gulp.series('styles'));
это просто дает мне Starting 'default'... и после изменения файла Starting 'styles'...
с глотком 3,9 это было 

Starting 'default'...
Finished 'default' after 174 ms

и после изменения файла 

Starting 'styles'...
Finished 'styles' after 561 μs

Сейчас я пробовал много разных вещей, но я просто не заставляю его работать так, как раньше. Я действительно думаю о переходе на webpack, как крутые дети сейчас. Но Gulp всегда работал нормально.

Может кто-нибудь объяснить мне, что я делаю не так?

Ответы [ 3 ]

0 голосов
/ 04 января 2019

Я боролся с этим сам ..

у меня ушло несколько часов головной боли, чтобы выяснить, что в основном все меняется с v4.0

Я запустил свой код, как это, и он отлично работает ... 

//Do everything once!
  gulp.task('default', function(){
    gulp.watch('src/styles/*.css', gulp.series('css')),
    gulp.watch('src/html/*.html', gulp.series('copyHTML')),
    gulp.watch('src/js/*.js', gulp.series('scripts')),
    gulp.watch('src/images/*', gulp.series('imageMIN'));
  return
});
0 голосов
/ 06 апреля 2019

Может использоваться через событие 

function watch() {
    const watcher = gulp.watch('src/styles/**/*.scss');
    watcher.on('change', function(path, stats) {
        styles(); //styles task
    });
}

exports.default = gulp.series(watch);
0 голосов
/ 30 августа 2018

Я просто забыл вернуться ...
return gulp.watch('src/styles/**/*.scss', gulp.series('styles'));
и
return gulp.src('src/styles/main.scss')

Полный код: 

var gulp = require('gulp');
var sass = require('gulp-sass');
var postcss = require('gulp-postcss');
var autoprefixer = require('autoprefixer');
var cssnano = require('cssnano');

gulp.task('default', function () {
    return gulp.watch('src/styles/**/*.scss', gulp.series('styles'));
});

gulp.task('styles', function () {
    var processors = [
        autoprefixer({
            browsers: ['last 3 versions', 'ie > 9']
        }),
        cssnano()
    ];
    return gulp.src('src/styles/main.scss')
        .pipe(sass().on('error', sass.logError))
        .pipe(postcss(processors))
        .pipe(gulp.dest('dist/files/styles/'));
});
...