Ошибка при запуске GULP, как решить?

Question

[Taron4uk]

Добрый день. Подскажите, пожалуйста, скопировал из документации сайта https://www.browsersync.io SASS + CSS Injecting вот такой код:

var gulp        = require('gulp');
var browserSync = require('browser-sync').create();
var sass        = require('gulp-sass');

// Static Server + watching scss/html files
gulp.task('serve', ['sass'], function() {

    browserSync.init({
        server: "./app"
    });

    gulp.watch("app/scss/*.scss", ['sass']);
    gulp.watch("app/*.html").on('change', browserSync.reload);
});

// Compile sass into CSS & auto-inject into browsers
gulp.task('sass', function() {
    return gulp.src("app/scss/*.scss")
        .pipe(sass())
        .pipe(gulp.dest("app/css"))
        .pipe(browserSync.stream());
});

gulp.task('default', ['serve']);

Конечно же, все папки прописал, под свои, но при запуске через командную строку выходит ошибка

PS C:\Users\Home\Desktop\project> gulp

assert.js:350
    throw err;
    ^

AssertionError [ERR_ASSERTION]: Task function must be specified
    at Gulp.set [as _setTask] (C:\Users\Home\Desktop\project\node_modules\undertaker\lib\set-task.js:10:3)
    at Gulp.task (C:\Users\Home\Desktop\project\node_modules\undertaker\lib\task.js:13:8)
    at Object.<anonymous> (C:\Users\Home\Desktop\project\gulpfile.js:5:6)
    at Module._compile (internal/modules/cjs/loader.js:689:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:700:10)
    at Module.load (internal/modules/cjs/loader.js:599:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:538:12)
    at Function.Module._load (internal/modules/cjs/loader.js:530:3)
    at Module.require (internal/modules/cjs/loader.js:637:17)
    at require (internal/modules/cjs/helpers.js:22:18)

Comments

[Dima Polos]

В default нет функции для запуска.

[Dima Polos]

serve это таска, которая запуститься вместе с функцией из default, но кроме [serve] в default нет ничего.

[RAX7]

Gulp 4 версии?

[Taron4uk]

RAX7, да

[RAX7]

Taron4uk, Запуск GULP почему ошибка?

Answer 1

[Martovitskiy]

У Вас установлен Gulp 4, а синтаксис Gulp 3. В 4 - новая система выполнения задач - gulp.parallel и gulp.series
Смотрите тут и тут
Ну и в дополнение:

function browserSync(done) {
  browsersync.init({
    server: {
      baseDir: "./"
    },
    port: 3000,
    notify: false 
  });
  done();
}

Comments

[Taron4uk]

Извините, пожалуйста, сможете объяснить что куда вставлять надо?
Заранее спасибо огромное!

[Martovitskiy]

Taron4uk, так пробуйте

function browserSync(done) {
  browsersync.init({
    server: {
      baseDir: "./"
    },
    port: 3000,
    notify: false 
  });
  done();
}
function gulpSass() {
  return gulp
    .src('app/sass/**/*.sass')
    .pipe(sass({ outputStyle: "expanded" }))
    .pipe(gulp.dest('app/css'))
    .pipe(browsersync.stream()) 
}

gulp.task('sass', gulpSass);
gulp.task('browser-sync', browserSync);
gulp.task('default', gulp.parallel(browserSync, sass));

[Taron4uk]

Сделал всё, запускается. Но переходит в директорию сайта через localhost, то есть не открывает сам index.html , как я понимаю

[Martovitskiy]

Taron4uk, так а где index.html? Если в src, то
baseDir: 'src'

[Taron4uk]

Да, baseDir задал правильно.
А вот путь к index.html не знаю как провести (находится он в src/index.html)

[Martovitskiy]

Taron4uk, покажите еще раз gulpfile.js

[Taron4uk]

Martovitskiy,

var gulp = require('gulp');
var browserSync = require('browser-sync');
var sass        = require('gulp-sass');

function browserSync(done) {
  browsersync.init({
    server: {
      baseDir: "src/*.html"
    },
    port: 3000,
    notify: false 
    
  });
  done();
}
function gulpSass() {
  return gulp
    .src('src/sass/**/*.sass')
    .pipe(sass({ outputStyle: "expanded" }))
    .pipe(gulp.dest('src/css'))
    .pipe(browsersync.stream()) 
}

gulp.task('sass', gulpSass);
gulp.task('browser-sync', browserSync);
gulp.task('default', gulp.parallel(browserSync, sass));

[Martovitskiy]

Taron4uk, просто baseDir: "src*

скопируйте

const gulp          = require('gulp'),
      sass          = require('gulp-sass'),
      browsersync   = require("browser-sync").create();

function browserSync(done) {
  browsersync.init({
    server: {
      baseDir: "src"
    },
    port: 3000,
    notify: false
  });
  done();
}

function gulpSass() {
  return gulp
    .src('app/sass/**/*.sass')
    .pipe(sass({ outputStyle: "expanded" }))
    .pipe(gulp.dest('app/css'))
    .pipe(browsersync.stream())
}

gulp.task('sass', gulpSass);
gulp.task('browser-sync', browserSync);
gulp.task('default', gulp.parallel(browserSync, sass));

[Taron4uk]

Martovitskiy, спасибо ОГРОМНОЕ! Выручили!