Gulpfile.js failed to load

Question

Visual Studio task runner cannot load the gulp file. I use VS2017 v15.9.4 now, however, the project developed some years ago.

Failed to run "...\Gulpfile.js"...
cmd.exe /c gulp --tasks-simple
assert.js:350
    throw err;
    ^
AssertionError [ERR_ASSERTION]: Task function must be specified
    at Gulp.set [as _setTask] (...\node_modules\undertaker\lib\set-task.js:10:3)
    at Gulp.task (...\node_modules\undertaker\lib\task.js:13:8)
    at Object.<anonymous> (...\gulpfile.js:34: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)

I replaced my project local address by "..."

npm -v --> 6.4.1

node -v --> 10.14.2

gulp -v --> CLI version 2.0.1
            Local version 4.0.0

The content of package.json file:

{
  "version": "1.0.0",
  "name": "tratic",
  "private": true,
  "devDependencies": {
    "gulp": "github:gulpjs/gulp#4.0",
    "gulp-clean-css": "3.5.0",
    "gulp-concat": "2.6.1",
    "gulp-durandal": "1.1.7",
    "gulp-install": "^1.1.0",
    "gulp-uglify": "3.0.0",
    "gulp-util": "3.0.8",
    "rimraf": "2.6.1"
  },
  "dependencies": {
    "assert": "^1.4.1",
    "assert-js": "^0.20.0",
    "natives": "^1.1.5"
  },
  "scripts": {
    "gulp": "./node_modules/gulp/bin/gulp.js"
  }
}

The content of gulpfile.js:

var gulp = require('gulp'),
    durandal = require('gulp-durandal'),
    rimraf = require('rimraf');

gulp.task('clean', function (cb) {
    rimraf('app/main-built.js', cb);
});

gulp.task('durandal', ['clean'], function () {
    durandal({
        baseDir: 'app',
        main: 'main.js',
        output: 'main-built.js',
        almond: true,
        minify: true
    })
    .pipe(gulp.dest('app'));
});

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

I google it and the existing solutions cannot solve the problem. There are some related issue but does not work for me.

How can I solve the problem?

Quay

if you've found solution you can write it as answer instead of adding it as edit to other answers – Interrogation

So what was wrong with your initial code? – Hankins

@Hankins I used gulp 4 with the gulp 3 syntax. However there was another another problem in durandal function that I solved it and edit the answer below. – Quay

Yes, your error: :Task function must be specified" was solved by my explanation below. The durandel issue hadn't been reached by your code yet. – Hankins

Thank you @Hankins your answer helped me. at the first I find the syntax error from your answer. could you explain what is the problem? why does the durandal issue hadn't been reached by the code? – Quay

Because gulp failed on the task syntax error - using the gulp3 gulp.task('default', ['anyTaskHere']) version - before getting to any other errors like a plugin issue. It just failed and quit before it got to any other code. Do look at the pump link I mentioned, it is easy to add and probably would have given you a line number and more info on this error. – Hankins

Gulp4 changed the syntax for calling tasks - you can't use the ['someTask'] method anymore - it is an error in gulp4. Since you were calling only one task you could use gulp.task('default', 'durandal') or gulp.task('default', gulp.series('durandal'). Gulp4 has many more benefits which you should investigate. The function syntax and exports for instance. – Hankins

Answer 1

I have tried your setup, it indeed threw an error like yours. I went to the gulp docs and tried their version of a gulpfile, and it worked with no issues. So I have rewritten your gulpfile to match their example and it worked well.

here's the code:

var gulp = require('gulp'),
    durandal = require('gulp-durandal'),
    rimraf = require('rimraf');

var paths = {
    app: "./App/**/*.js",
    js: "./Scripts/**/*.js",
    css: "./Content/**/*.css",
    concatJsDest: "./Scripts/vendor-scripts.min.js",
    concatCssDest: "./Content/vendor-css.min.css"
};

function clean (cb) {
    rimraf('app/main-built.js', cb);
}

gulp.task('clean', clean);

function runDurandal () {
    return durandal({
        baseDir: 'app',
        main: 'main.js',
        output: 'main-built.js',
        almond: true,
        minify: true,
        rjsConfigAdapter: function (rjsConfig) {
            rjsConfig.deps = ['text'];
            return rjsConfig;
        }
    })
    .pipe(gulp.dest('app'));
}

var build = gulp.series(clean, runDurandal);

gulp.task('default', build);

Basically I have moved functions that you use as tasks to variables, and used series to run durandal.

then I have tried npx gulp --tasks-simple and have a proper output

clean
default

btw, have a look at npx so you don't have to install gulp globally.

Hope that helps!

Phytohormone

Answer 2

This syntax is no longer allowed in gulp4:

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

Use :

gulp.task('default', gulp.series('durandal'));

Likewise change to:

gulp.task('durandal', gulp.series('clean', function (done) {
    durandal({
        baseDir: 'app',
        main: 'main.js',
        output: 'main-built.js',
        almond: true,
        minify: true
    })
    .pipe(gulp.dest('app'));
    done();
});

Also, using pump would probably give you better error reporting than you are getting without it.

Hankins

Answer 3

Try to use this workaround: https://github.com/ampproject/docs/issues/793 Downgrade gulp to this version 3.9.1.

Invar

I did it before but it couldnt solve the problem, i got some new errors. I tried to change my gulp file an change it to v4. it works. – Quay

Task function must be specified. i read better it misses the abstract function inside the "default" task. – Invar

gulp.task('default', ['durandal'], function(par1, par2, ..., parN){}); – Invar

did you fix it? and how? – Invar

please take a look to the answer marked as correct. – Quay