Gulp 4 array as source

Question

I'm attempting to upgrade to Gulp 4 in an existing project. I have created a task called vendor with the intent of concatenating and minifying global javascript packages. Unfortunately I'm receiving an error when compiling with the following code:

function vendor() {
    const source = [
        './node_modules/@popperjs/core/dist/umd/popper.js',
        './node_modules/bootstrap/dist/js/bootstrap.js',
        './node_modules/slick-carousel/slick/slick.js'
    ];

    return src(source)
        .pipe(changed(source))
        .pipe(concat('vendor.js'))
        .pipe(uglify())
        .pipe(rename({
            extname: '.min.js'
        }))
        .pipe(dest('./dist/js/'))
}

exports.build = series(parallel(vendor, js));

The error that I'm receiving is TypeError [ERR_INVALID_ARG_TYPE]: The "path" argument must be of type string. Received type object.

It looks like my specific issue is related to `gulp-changed` because removing it from my vendor task results in the `build` task completing successfully. — Hughes, Dec 16 '21 at 18:05

score 0 · Answer 1 · answered Dec 16 '21 at 17:33

This on my side functional (with path that I had on my project). Can you try this task and see if it works well ?

const {src, dest, task} = require("gulp");
const stripDebug = require('gulp-strip-debug');
const logger = require('node-color-log');
const uglify = require('gulp-uglify');

const source = [
  './node_modules/@popperjs/core/dist/umd/popper.js',
  './node_modules/bootstrap/dist/js/bootstrap.js',
  './node_modules/slick-carousel/slick/slick.js'
];

const jsDest = "./dist/js/";

function compressJs(callback) {
  logger.color('yellow').log(`Removing console.log() and uglifying js from ${source} to: ${jsDest}`);

    src(source)
    .pipe(stripDebug())
    .pipe(uglify())
    .pipe(dest(`${jsDest}`))
    .on('end', function () {
        callback();
    });
}

const Js = task('compress:js', compressJs);
exports.Js = Js;

Gulp 4 array as source

1 Answers1