Gulp task never defined

Question

I have problems while changing the syntax from gulp v3 to gulp v4. I almost got the code but a small error occurred. Can anyone help me with that error? And I have no previous knowledge of gulp this is the first task I'm performing hope anyone can help me to get through this.

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

// Compile Sass & Inject Into Browser
function style() {
  return gulp.src(['node_modules/bootstrap/scss/bootstrap.scss', 'src/scss/*.scss'])
    .pipe(sass())
    .pipe(gulp.dest("src/css"))
    .pipe(browserSync.stream());
};

// Move JS Files to src/js
function js() {
  return gulp.src(['node_modules/bootstrap/dist/js/bootstrap.min.js', 'node_modules/jquery/dist/jquery.min.js', 'node_modules/popper.js/dist/umd/popper.min.js'])
    .pipe(gulp.dest("src/js"))
    .pipe(browserSync.stream());
};

// Watch Sass & Server
function watch() {
  browserSync.init({
    server: "./src"
  });

  gulp.watch(['node_modules/bootstrap/scss/bootstrap.scss', 'src/scss/*.scss'], ['sass']);
  gulp.watch("src/*.html").on('change', browserSync.reload);
  // gulp.watch("src/*.html", gulp.series(copyHtml, browserSyncReload));
};

// Move Fonts Folder to src/fonts
function fonts() {
  return gulp.src('node_modules/font-awesome/fonts/*')
    .pipe(gulp.dest("src/fonts"));
};

// Move Font Awesome CSS to src/css
function fa() {
  return gulp.src('node_modules/font-awesome/css/font-awesome.min.css')
    .pipe(gulp.dest("src/css"));
};

exports.style = style;
exports.watch = watch;
exports.fonts = fonts;
exports.fa = fa;
exports.default = series(style, watch, fonts, fa);

Error Occurred

 ReferenceError: series is not defined
    at Object.<anonymous> (D:\Courses\Projects\Bootstrap_projects\bs4starter\gulpfile.js:47:1)
    at Module._compile (internal/modules/cjs/loader.js:1015:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1035:10)
    at Module.load (internal/modules/cjs/loader.js:879:32)
    at Function.Module._load (internal/modules/cjs/loader.js:724:14)
    at Module.require (internal/modules/cjs/loader.js:903:19)
    at require (internal/modules/cjs/helpers.js:74:18)
    at requireOrImport (C:\Users\sai\AppData\Roaming\npm\node_modules\gulp-cli\lib\shared\require-or-import.js:19:11)
    at execute (C:\Users\sai\AppData\Roaming\npm\node_modules\gulp-cli\lib\versioned\^4.0.0\index.js:37:3)
    at Liftoff.handleArguments (C:\Users\sai\AppData\Roaming\npm\node_modules\gulp-cli\index.js:211:24)

Thank you in advance.

You are not specifying a task on the command line, nor do you define a `default` task. The error is clear. — crashmstr, Oct 14 '20 at 17:19
can you please tell me how to add it, I'm kinda new to it @crashmstr — Sateesh Gollapudi, Oct 14 '20 at 17:21
Adding a default task is right there in the [documentation](https://gulpjs.com/docs/en/getting-started/creating-tasks/) - `export.default = myDefaultTask` — crashmstr, Oct 14 '20 at 17:26
Can you please modify the code and submit it as an answer. I'm unable to complete it @crashmstr — Sateesh Gollapudi, Oct 14 '20 at 17:33
still unable to modify the code can you please complete the code with the correct answer @crashmstr — Sateesh Gollapudi, Oct 15 '20 at 12:19
You do not specify **what** you want to be the default task, so there is no way I could give you the exact code. You already have `exports.style`, `exports.watch`, etc. Add *one* more that is `exports.default` and assign it what you want gulp to default to when no task specified on the command line. I do not know how to more clearly explain it. — crashmstr, Oct 15 '20 at 14:33
I explained clearly now can you please go through that again @crashmstr — Sateesh Gollapudi, Oct 15 '20 at 17:03
I've updated my answer to include your desired `default` with updated example for using `gulp.series` instead of `series` (difference based on how you `require` vs. the Gulp example). — crashmstr, Oct 16 '20 at 11:11

crashmstr · Answer 1 · 2020-10-16T11:10:05.097

You do not specify a default task, so gulp tells you this in an error message when you call it without specifying a task.

https://gulpjs.com/docs/en/getting-started/creating-tasks/

In the past, task() was used to register your functions as tasks. While that API is still available, exporting should be the primary registration mechanism, except in edge cases where exports won't work.

Here is an example that would do style, fonts, fa in a series when gulp is run with no specified task:

exports.default = gulp.series(style, fonts, fa);

Since you require('gulp') as gulp, you can use gulp.series. My previous example was based on Gulp's own example where they instead use const { series } = require('gulp'); to import just series as its own function.

Gulp task never defined

1 Answers1