Gulp Fails with "RangeError: Maximum Call Stack Size Exceeded"

[ndmax]

I have a build script that uses gulp to compile js/css. After updating to Gulp 5, compile fails. I'm guessing I need to refactor the gulpfile somehow (?), but I'm having difficulty using the JavaScript error to chase down a solution. Please let me know if I can post any additional details. Thank you for any help you may provide.

Running gulp on Ubuntu 23.04 (with node v22.0.0)

[07:21:23] Using gulpfile /path/to/gulpfile.js
[07:21:23] Starting 'default'...
[07:21:23] Starting 'css'...
[07:21:25] 'css' errored after 2.17 s
[07:21:25] RangeError: Maximum call stack size exceeded
    at Stats.set [as atime] (node:internal/fs/utils:469:18)
    at Stats.set [as atime] (node:internal/fs/utils:469:18)
    at Stats.set [as atime] (node:internal/fs/utils:469:18)
    at Stats.set [as atime] (node:internal/fs/utils:469:18)
    at Stats.set [as atime] (node:internal/fs/utils:469:18)
    at Stats.set [as atime] (node:internal/fs/utils:469:18)
    at Stats.set [as atime] (node:internal/fs/utils:469:18)
    at Stats.set [as atime] (node:internal/fs/utils:469:18)
    at Stats.set [as atime] (node:internal/fs/utils:469:18)
    at Stats.set [as atime] (node:internal/fs/utils:469:18)
[07:21:25] 'default' errored after 2.17 s

From package.json:

    "gulp": "^5.0.0",
    "gulp-autoprefixer": "^9.0.0",
    "gulp-concat": "^2.6.1",
    "gulp-dart-sass": "^1.1.0",
    "gulp-exec": "^5.0.0",
    "gulp-remote-src": "^0.4.4",
    "gulp-sourcemaps": "^3.0.0",
    "gulp-strip-comments": "^2.6.0",
    "gulp-uglify": "^3.0.2",
    "pump": "^3.0.0",
    "uglify-js": "^3.17.4"

Contents of gulpfile.js:

// task builder
import gulp from 'gulp';

// task submodules
import autoprefixer from 'gulp-autoprefixer';
import concat from 'gulp-concat';
import sass from 'gulp-dart-sass';
import sourcemaps from 'gulp-sourcemaps';
import strip from 'gulp-strip-comments';
import uglify from 'gulp-uglify';
import pump from 'pump';

// build style sheets
gulp.task('css', function () {
  var stripOptions = { ignore: '/url\([\w\s:\/=\-\+;,]*\)/g' };
  var sassOptions = { outputStyle: 'compressed' };
  return gulp
    .src('./scss/style.scss')
    .pipe(sourcemaps.init())
    .pipe(sass(sassOptions))
    .pipe(autoprefixer())
    .pipe(strip.text(stripOptions))
    .pipe(sourcemaps.write('.'))
    .pipe(gulp.dest('./stage/css'));
  }
);

// build javascript
var uglifyopt = {
  mangle: {                // compress variable names except those listed below
    reserved: ['exception'],
  },
  warnings        : false,  // warn about potentially dangerous optimizations/code
  compress: {
    sequences     : true,  // join consecutive statements with the comma operator
    properties    : true,  // optimize property access: a[foo] to a.foo
    dead_code     : true,  // discard unreachable code
    drop_debugger : true,  // discard debugger statements
    unsafe        : true,  // some unsafe optimizations
    conditionals  : true,  // optimize if-s and conditional expressions
    comparisons   : true,  // optimize comparisons
    evaluate      : true,  // evaluate constant expressions
    booleans      : true,  // optimize boolean expressions
    loops         : true,  // optimize loops
    unused        : false,  // drop unused variables/functions
    hoist_funs    : true,  // hoist function declarations
    hoist_vars    : true,  // hoist variable declarations
    if_return     : true,  // optimize if-s followed by return/continue
    join_vars     : true,  // join var declarations
    collapse_vars : true,  // collapse single-use non-constant variables, side effects permitting
    side_effects  : true,  // drop side-effect-free statements
    global_defs   : {}     // global definitions
  }
};

gulp.task('js-header', function(cb) {
  pump([
    gulp.src('./js/header/*.js'),
    sourcemaps.init(),
    concat('header.js'),
    uglify(uglifyopt),
    sourcemaps.write('.'),
    gulp.dest('./stage/js')
  ], cb);
});

gulp.task('js-base', function(cb) {
  pump([
    gulp.src ([
      './js/base/bootstrap.js'
    ]),
    sourcemaps.init(),
    concat('base.js'),
    uglify(uglifyopt),
    sourcemaps.write('.'),
    gulp.dest('./stage/js')
  ], cb);
});

gulp.task('js-footer', function(cb) {
  pump([
    gulp.src('./js/footer/*.js'),
    sourcemaps.init(),
    concat('footer.js'),
    uglify(uglifyopt),
    sourcemaps.write('.'),
    gulp.dest('./stage/js')
  ], cb);
});

gulp.task('default', gulp.series('css', 'js-header', 'js-base', 'js-footer'));

[yocontra]

You shouldn't need to use pump at all anymore, just simple .pipe and return the stream from each task.

The Stats.set issue is a node 22 bug that was patched, update your node version to latest.

[ndmax]

Thank you, @yocontra.

The Node 22 bug was indeed the culprit, and updating to v22.1.0 resolved the issue, although I do still receive the following warning, I think during the CSS build task: [DEP0180] DeprecationWarning: fs.Stats constructor is deprecated.

I took the opportunity to drop pump and (mostly) adapt my gulpfile script to the recommended v5 conventions; everything building just fine now.