Search code examples
node.jsgulp

Gulp 5 not compile if src have multiple items


I have a problem with Gulp because it doesn't compile if there is more than one specific element in the SRC. I need multiple files to be compiled on the JS, PHP and IMG.

Node: 23.1.0 NPM: 10.9.1 Gulp: 5.0 Gulp Cli: 3.0.0

This is my code

import gulp from "gulp";
import * as sass from "sass";
import gulpSass from "gulp-sass";
const scss = gulpSass(sass);
import prefix from "gulp-autoprefixer";
import cssmin from "gulp-cssmin";
import concat from "gulp-concat";
import uglify from "gulp-uglify";
import babel from "gulp-babel";
import webp from "gulp-webp";
import browserSync from "browser-sync";

const { src, dest, series, parallel, watch } = require("gulp");

async function gulpPHP() {
  return src("./dist/**/*.php").pipe(browserSync.stream());
}

async function gulpScss() {
  return src("./src/scss/main.scss")
    .pipe(scss({ outputStyle: "compressed" }).on("error", scss.logError))
    .pipe(prefix())
    .pipe(dest("./dist/css/"))
    .pipe(browserSync.stream());
}

async function gulpJS() {
  return src("./src/sjs/**/*.js")
    .pipe(babel({ presets: ["@babel/preset-env"] }))
    .pipe(concat("main.js"))
    .pipe(uglify())
    .pipe(dest("./dist/js/"))
    .pipe(browserSync.stream());
}

async function gulpImg() {
  return gulp
    .src([
      "src/images/**/*.{jpg,jpeg,webp,png}",
      "src/images/*.{jpg,jpeg,webp,png}",
    ])
    .pipe(webp())
    .pipe(dest("dist/images/"))
    .pipe(browserSync.stream());
}

function gulpWatch() {
  watch("./src/scss/**/*.scss", gulpScss);
  watch("./src/sjs/**/*.js", gulpJS);
  watch("./dist/**/*.php", gulpPHP);
  watch(
    ["src/images/**/*.{jpg,jpeg,webp,png}", "src/images/*.{jpg,jpeg,webp,png}"],
    gulpImg
  );
}

function gulpSync() {
  browserSync.init({
    proxy: "damas.test",
  });
}

exports.default = series(
  gulpScss,
  gulpJS,
  gulpPHP,
  gulpImg,
  parallel(gulpWatch, gulpSync)
);

The only thing that compiles gulp correctly is the SCSS because there is the direct file.

The strange thing is that gulp works but not compile/create file:

[15:52:53] Starting 'gulpJS'...
[15:52:53] Finished 'gulpJS' after 4.82 ms
[15:52:56] Starting 'gulpJS'...
[15:52:56] Finished 'gulpJS' after 3.53 ms

In the JS i also tried to put in SRC this but still not work:

src(["./src/sjs/components/*.js", "./src/sjs/main.js"])

Honestly I don't know what else to try to make it work and I'm afraid it's a bug in version 5 of gulp... does it work for anyone?


Solution

  • That is a reported issue, see src() doesn't work with wildcards (4.0.2 -> 5.0.0).

    The only solution at this point is to downgrade to v4+ unfortunately. I am seeing the same issue.