I'm trying to run the command below but unfortunately I run into errors. 

$ gulp build

In my terminal and I get this assertion error. I've uninstalled node and NPM and reinstalled again using brew - How do I completely uninstall Node.js, and reinstall from beginning (Mac OS X) with these steps. My node version is v10.5.0 and npm version is 6.1.0.

My system is MacOS High Sierra 10.13.2 

assert.js:269 throw err; ^ AssertionError [ERR_ASSERTION]: Task function must be specified at Gulp.set [as _setTask] (bulkit/startup-kit/node_modules/undertaker/lib/set-task.js:10:3) at Gulp.task (startup-kit/node_modules/undertaker/lib/task.js:13:8) at Object.<anonymous> at Module._compile (internal/modules/cjs/loader.js:702:30) at Object.Module._extensions..js (internal/modules/cjs/loader.js:713:10) at Module.load (internal/modules/cjs/loader.js:612:32) at tryModuleLoad (internal/modules/cjs/loader.js:551:12) at Function.Module._load (internal/modules/cjs/loader.js:543:3) at Module.require (internal/modules/cjs/loader.js:650:17) at require (internal/modules/cjs/helpers.js:20:18)

package.json

{ "name": "bulkit-startup", "version": "0.0.1", "description": "Bulkit Startup Kit", "main": "Gruntfile.js", "devDependencies": { "autoprefixer": "^6.3.6", "browser-sync": "^2.24.5", "gulp": "^4.0.0", "gulp-clean": "^0.3.2", "gulp-concat": "^2.6.0", "gulp-postcss": "^6.1.0", "gulp-sass": "^2.2.0", "gulp-sourcemaps": "^1.6.0", "jquery": "^3.3.1", "mq4-hover-shim": "^0.3.0", "panini": "^1.3.0", "rimraf": "^2.5.2" }, "engines": { "node": ">=0.10.1" }, "scripts": { "start": "gulp", "build": "gulp build" }, "repository": { "type": "git", "url": "" }, "bugs": { "url": "", "email": "[email protected]" }, "author": "Css Ninja <[email protected]> ()", "license": "Commercial", "private": true, "dependencies": { "bulma": "^0.7.0", "del": "^3.0.0", "jquery-waypoints": "^2.0.5", "jquery.counterup": "^2.1.0", "scrollreveal": "^3.4.0", "slick-carousel": "^1.8.1", "wallop": "^2.4.1" } }

gulpfile.js

var gulp = require('gulp'); var clean = require('gulp-clean'); var sass = require('gulp-sass'); var sourcemaps = require('gulp-sourcemaps'); var postcss = require('gulp-postcss'); var autoprefixer = require('autoprefixer'); var mq4HoverShim = require('mq4-hover-shim'); var rimraf = require('rimraf').sync; var browser = require('browser-sync'); var panini = require('panini'); var concat = require('gulp-concat'); var port = process.env.SERVER_PORT || 8080; var nodepath = 'node_modules/'; var assetspath = 'assets/'; // Starts a BrowerSync instance gulp.task('server', ['build'], function(){ browser.init({server: './_site', port: port}); }); // Watch files for changes gulp.task('watch', function() { gulp.watch('scss/**/*', ['compile-scss', browser.reload]); gulp.watch('sass/**/*', ['compile-sass', browser.reload]); gulp.watch('js/**/*', ['copy-js', browser.reload]); gulp.watch('images/**/*', ['copy-images', browser.reload]); gulp.watch('html/pages/**/*', ['compile-html']); gulp.watch(['html/{layouts,includes,helpers,data}/**/*'], ['compile-html:reset','compile-html']); gulp.watch(['./src/{layouts,partials,helpers,data}/**/*'], [panini.refresh]); }); // Erases the dist folder gulp.task('reset', function() { rimraf('bulma/*'); rimraf('scss/*'); rimraf('assets/css/*'); rimraf('assets/fonts/*'); rimraf('images/*'); }); // Erases the dist folder gulp.task('clean', function() { rimraf('_site'); }); // Copy Bulma filed into Bulma development folder gulp.task('setupBulma', function() { //Get Bulma from node modules gulp.src([nodepath + 'bulma/*.sass']).pipe(gulp.dest('bulma/')); gulp.src([nodepath + 'bulma/**/*.sass']).pipe(gulp.dest('bulma/')); }); // Copy static assets gulp.task('copy', function() { //Copy other external font and data assets gulp.src(['assets/fonts/**/*']).pipe(gulp.dest('_site/assets/fonts/')); gulp.src([nodepath + 'slick-carousel/slick/fonts/**/*']).pipe(gulp.dest('_site/assets/css/fonts/')); gulp.src([nodepath + 'slick-carousel/slick/ajax-loader.gif']).pipe(gulp.dest('_site/assets/css/')); }); //Theme Sass variables var sassOptions = { errLogToConsole: true, outputStyle: 'compressed', includePaths: [nodepath + 'bulma/sass'] }; //Theme Scss variables var scssOptions = { errLogToConsole: true, outputStyle: 'compressed', includePaths: ['./scss/partials'] }; // Compile Bulma Sass gulp.task('compile-sass', function () { var processors = [ mq4HoverShim.postprocessorFor({ hoverSelectorPrefix: '.is-true-hover ' }), autoprefixer({ browsers: [ "Chrome >= 45", "Firefox ESR", "Edge >= 12", "Explorer >= 10", "iOS >= 9", "Safari >= 9", "Android >= 4.4", "Opera >= 30" ] })//, //cssnano(), ]; //Watch me get Sassy return gulp.src('./bulma/bulma.sass') .pipe(sourcemaps.init()) .pipe(sass(sassOptions).on('error', sass.logError)) .pipe(postcss(processors)) .pipe(sourcemaps.write()) .pipe(gulp.dest('./_site/assets/css/')); }); // Compile Theme Scss gulp.task('compile-scss', function () { var processors = [ mq4HoverShim.postprocessorFor({ hoverSelectorPrefix: '.is-true-hover ' }), autoprefixer({ browsers: [ "Chrome >= 45", "Firefox ESR", "Edge >= 12", "Explorer >= 10", "iOS >= 9", "Safari >= 9", "Android >= 4.4", "Opera >= 30" ] })//, //cssnano(), ]; //Watch me get Sassy return gulp.src('./scss/core.scss') .pipe(sourcemaps.init()) .pipe(sass(sassOptions).on('error', sass.logError)) .pipe(postcss(processors)) .pipe(sourcemaps.write()) .pipe(gulp.dest('./_site/assets/css/')); }); // Compile Html gulp.task('compile-html', function() { gulp.src('html/pages/**/*.html') .pipe(panini({ root: 'html/pages/', layouts: 'html/layouts/', partials: 'html/includes/', helpers: 'html/helpers/', data: 'html/data/' })) .pipe(gulp.dest('_site')) .on('finish', browser.reload); }); gulp.task('compile-html:reset', function(done) { panini.refresh(); done(); }); // Compile css from node modules gulp.task('compile-css', function() { return gulp.src([ nodepath + 'slick-carousel/slick/slick.css', nodepath + 'slick-carousel/slick/slick-theme.css', nodepath + 'wallop/css/wallop.css', //Additional static css assets assetspath + 'css/icons.min.css', ]) .pipe(concat('app.css')) .pipe(gulp.dest('./_site/assets/css/')); }); // Compile js from node modules gulp.task('compile-js', function() { return gulp.src([ nodepath + 'jquery/dist/jquery.min.js', nodepath + 'slick-carousel/slick/slick.min.js', nodepath + 'scrollreveal/dist/scrollreveal.min.js', nodepath + 'waypoints/lib/jquery.waypoints.min.js', nodepath + 'waypoints/lib/shortcuts/sticky.min.js', nodepath + ' nodepath + 'wallop/js/Wallop.min.js', //Additional static js assets assetspath + 'js/ggpopover/ggpopover.min.js', assetspath + 'js/ggpopover/ggtooltip.js', assetspath + 'js/embed/embed.js', assetspath + 'js/gmap/gmap.min.js', ]) .pipe(concat('app.js')) .pipe(gulp.dest('./_site/assets/js/')); }); //Copy Theme js to production site gulp.task('copy-js', function() { gulp.src('js/**/*.js') .pipe(gulp.dest('./_site/assets/js/')); }); //Copy images to production site gulp.task('copy-images', function() { gulp.src('images/**/*') .pipe(gulp.dest('./_site/assets/images/')); }); gulp.task('init', ['setupBulma']); gulp.task('build', ['clean','copy', 'compile-js', 'compile-css', 'copy-js', 'compile-sass', 'compile-scss', 'compile-html', 'copy-images']); gulp.task('default', ['server', 'watch']);

13 Answers

Gulp 4.0 has changed the way that tasks should be defined if the task depends on another task to execute. The list parameter has been deprecated.

An example from your gulpfile.js would be:

// Starts a BrowerSync instance gulp.task('server', ['build'], function(){ browser.init({server: './_site', port: port}); });

Instead of the list parameter they have introduced gulp.series() and gulp.parallel().

This task should be changed to something like this:

// Starts a BrowerSync instance gulp.task('server', gulp.series('build', function(){ browser.init({server: './_site', port: port}); }));

I'm not an expert in this. You can see a more robust example in the gulp documentation for running tasks in series or these following excellent blog posts by Jhey Thompkins and Stefan Baumgartner

5

Try replacing your last line of gulpfile.js

gulp.task('default', ['server', 'watch']);

with

gulp.task('default', gulp.series('server', 'watch'));
1

Lower your gulp version in package.json file to 3.9.1- 

"gulp": "^3.9.1",
3

You don't need to downgrade your gulp from gulp 4. Use gulp.series() to combine multiple tasks. At first install gulp globally with

npm install --global gulp-cli

and then install locally on your working directory with

npm install --save-dev gulp

see details here

Example:

package.json

{ "name": "gulp-test", "version": "1.0.0", "description": "", "main": "index.js", "scripts": { "test": "echo \"Error: no test specified\" && exit 1" }, "author": "", "license": "ISC", "devDependencies": { "browser-sync": "^2.26.3", "gulp": "^4.0.0", "gulp-sass": "^4.0.2" }, "dependencies": { "bootstrap": "^4.3.1", "jquery": "^3.3.1", "popper.js": "^1.14.7" } }

gulpfile.js

var gulp = require("gulp"); var sass = require('gulp-sass'); var browserSync = require('browser-sync').create(); // Specific Task function js() { return gulp .src(['node_modules/bootstrap/dist/js/bootstrap.min.js', 'node_modules/jquery/dist/jquery.min.js', 'node_modules/) .pipe(gulp.dest('src/js')) .pipe(browserSync.stream()); } gulp.task(js); // Specific Task function gulpSass() { return gulp .src(['src/scss/*.scss']) .pipe(sass()) .pipe(gulp.dest('src/css')) .pipe(browserSync.stream()); } gulp.task(gulpSass); // Run multiple tasks gulp.task('start', gulp.series(js, gulpSass));

Run gulp start to fire multiple tasks & run gulp js or gulp gulpSass for specific task.

1

Because gulp.task(name, deps, func) was replaced by gulp.task(name, gulp.{series|parallel}(deps, func)).

You are using the latest version of gulp but older code. Modify the code or downgrade.

I get the same error when using Gulp. The solution is to switch to Gulp version 3.9.1, both for the local version and the CLI version.

sudo npm install -g [email protected]

Run in the project's folder

npm install [email protected]

The problem is that you are using gulp 4 and the syntax in gulfile.js is of gulp 3. So either downgrade your gulp to 3.x.x or make use of gulp 4 syntaxes.

Syntax Gulp 3:

gulp.task('default', ['sass'], function() {....} );

Syntax Gulp 4:

gulp.task('default', gulp.series(sass), function() {....} );

You can read more about gulp and gulp tasks on:

While migrating from Gulp 3.x to Gulp 4.x, these are the common errors we are getting:

Errors:

  • AssertionError [ERR_ASSERTION]: Task function must be specified
  • AssertionError [ERR_ASSERTION]: Task never defined:
  • The following tasks did not complete: Did you forget to signal async completion?

Here are few points to take care regarding task definition and execution:

  1. First define task
  2. Use return
  3. Then execute with gulp.series()

Here, is the quick Gulp code which is working with Gulp v4:

// First define task with Return gulp.task('css-minify', function () { return gulp.src('assets/images/*.*') .pipe(smushit({verbose: true})) .pipe(gulp.dest('assets/images')); }); // Then execute task with bracket '()' instead of '[]' gulp.task('default', gulp.series('css-minify'));

Replace the array in:

gulp.task('default', ['task1', 'task2','task3']);

with gulp.series()

gulp.task('default', gulp.series('task1', 'task2','task3'));
1

It's not good to keep changing the gulp & npm versions in-order to fix the errors. I was getting several exceptions last days after reinstall my working machine. And wasted tons of minutes to re-install & fixing those.

So, I decided to upgrade all to latest versions: 

npm -v : v12.13.0 node -v : 6.13.0 gulp -v : CLI version: 2.2.0 Local version: 4.0.2

This error is getting because of the how it has coded in you gulpfile but not the version mismatch. So, Here you have to change 2 things in the gulpfile to aligned with Gulp version 4. Gulp 4 has changed how initiate the task than Version 3.

  1. In version 4, you have to defined the task as a function, before call it as a gulp task by it's string name. In V3:

gulp.task('serve', ['sass'], function() {..});

But in V4 it should be like:

function serve() { ... } gulp.task('serve', gulp.series(sass));
  1. As @Arthur has mentioned, you need to change the way of passing arguments to the task function. It was like this in V3:

gulp.task('serve', ['sass'], function() { ... });

But in V4, it should be: 

gulp.task('serve', gulp.series(sass));

Replacing [] with gulp.series() definitely worked to me, and another change I've needed to do was to move my main task 'Ex. gulp main-task' to the end of the Gulp file using Gulp v4.02

1

worked after updating gulp.task() with gulp.task( gulp.series() );

Steps:

  1. "gulp": "^3.9.1",
  2. npm install
  3. gulp styles

Your Answer

Sign up or log in

Sign up using Google Sign up using Facebook Sign up using Email and Password

Post as a guest

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.