Ошибка Gulp, что делать?

Запускаю таск watch, идут одни и те же ошибки на каждой сборке
версия Gulp - 4
// Подключаем Gulp
var gulp = require("gulp");

// Подключаем плагины Gulp
var sass = require("gulp-sass"), // переводит SASS в CSS
    cssnano = require("gulp-cssnano"), // Минимизация CSS
    autoprefixer = require('gulp-autoprefixer'), // Проставлет вендорные префиксы в CSS для поддержки старых браузеров
    imagemin = require('gulp-imagemin'), // Сжатие изображение
    concat = require("gulp-concat"), // Объединение файлов - конкатенация
    uglify = require("gulp-uglify"), // Минимизация javascript
    rename = require("gulp-rename"); // Переименование файлов

/* --------------------------------------------------------
   ----------------- Таски ---------------------------
------------------------------------------------------------ */

// Копирование файлов HTML в папку dist
gulp.task("html", function() {
    return gulp.src("src/*.html")
    .pipe(gulp.dest("dist"));
});

// Объединение, компиляция Sass в CSS, простановка венд. префиксов и дальнейшая минимизация кода
gulp.task("sass", function() {
    return gulp.src("src/sass/*.sass")
        .pipe(concat('styles.sass'))
        .pipe(sass())
        .pipe(autoprefixer({
            browsers: ['last 2 versions'],
            cascade: false
         }))
        .pipe(cssnano())
        .pipe(rename({ suffix: '.min' }))
        .pipe(gulp.dest("dist/css"));
});

// Объединение и сжатие JS-файлов
gulp.task("scripts", function() {
    return gulp.src("src/js/*.js") // директория откуда брать исходники
        .pipe(concat('scripts.js')) // объеденим все js-файлы в один 
        .pipe(uglify()) // вызов плагина uglify - сжатие кода
        .pipe(rename({ suffix: '.min' })) // вызов плагина rename - переименование файла с приставкой .min
        .pipe(gulp.dest("dist/js")); // директория продакшена, т.е. куда сложить готовый файл
});

// Сжимаем картинки
gulp.task('imgs', function() {
    return gulp.src("src/images/*.+(jpg|jpeg|png|gif)")
        .pipe(imagemin({
            progressive: true,
            svgoPlugins: [{ removeViewBox: false }],
            interlaced: true
        }))
        .pipe(gulp.dest("dist/images"))
});

// Задача слежения за измененными файлами
gulp.task("watch", function() {
    gulp.watch("src/*.html", ["html"]);
    gulp.watch("src/js/*.js", ["scripts"]);
    gulp.watch("src/sass/*.sass", ["sass"]);
    gulp.watch("src/images/*.+(jpg|jpeg|png|gif)", ["imgs"]);
});

///// Таски ///////////////////////////////////////

// Запуск тасков по умолчанию
gulp.task("default", ["html", "sass", "scripts", "imgs", "watch"]);

gulp.task('taskname', function () {
    return gulp.src('source-files')
    .pipe(plugin-name())
    .pipe(gulp.dest('folder'))
});


Ошибки: rvkyS2jf1ik.jpg
  • Вопрос задан
  • 150 просмотров
Решения вопроса 1
andreydobrin
@andreydobrin
Сложно , но это пока
Прочитайте короткое объяснение ответа ниже, если нужен синтаксис gulp 4

gulp.task('watch', function(){
  gulp.watch("src/*.html", gulp.series("html"));
  gulp.watch("src/js/*.js", gulp.series("scripts"));
  gulp.watch("src/sass/*.sass", gulp.series("sass"));
  gulp.watch("src/images/*.+(jpg|jpeg|png|gif)", gulp.series("imgs"));
})


Oбъясню на счет parallel и series. То есть в первом случае Ваши task-и в потоке выполняются вместе. А в другом случае, сперва выполнится первый task, потом второй, третий и до конца.
Ответ написан
Комментировать
Пригласить эксперта
Ответы на вопрос 1
Martovitskiy
@Martovitskiy
Ошибки: rvkyS2jf1ik.jpg битая картинка...
1 - Вы используете Gulp 4, а синтаксис Gulp 3 . Пример синтаксиса
2 - если используете Gulp4 , то необходимо установить Gulp -cli
npm install -g gulp-cli
3 - куча видео в просторах интернета, как перейти на gulp 4
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы