Within my gulpfile.js file, after my tasks run I would like to remove all my .css files from my pub/ directory after they have landed there. This is my most modern attempt but my files never get removed..

const { src, dest, watch, parallel, series } = require("gulp");
const mPub = "./pub";
const del = require("del");

//...more packages, paths and code...

//this works
function genClean() {
  return del(["pub", "packagedDrive", "embeds"]);
}

//...more code...

//but this does not work
function removeStyleSheets() {
  return (
    del(['pub/**/*.css'])  
  ); 
}

//...more code...


//BUILD

exports.buildProd = series(
  genClean,
  parallel(
    genCSS,
    genViews.content,
    removeStyleSheets
  )
);


//WATCH

exports.watcher = series(
  genClean,
  parallel(
    genCSS,
    genViews.content,
    removeStyleSheets
  ),
  bSync
);

based on the del API docs, I also tried...

function removeStyleSheets() {
  return (
     (async () => {
      const deletedFilePaths = await del(['pub/*.css'], {dryRun: true});
      console.log('Deleted files:\n', deletedFilePaths.join('\n'));
    })()
  ); 
 }

and also tried...

function removeStyleSheets() {
  return (
    (async () => {
      const deletedFilePaths = await del(['pub/*.css', '!pub/*.html']);
      console.log('Deleted files:\n', deletedFilePaths.join('\n'));
    })()
  ); 
 }

But my files are still showing up...

Within my gulpfile.js file, after my tasks run I would like to remove all my .css files from my pub/ directory after they have landed there. This is my most modern attempt but my files never get removed..

const { src, dest, watch, parallel, series } = require("gulp");
const mPub = "./pub";
const del = require("del");

//...more packages, paths and code...

//this works
function genClean() {
  return del(["pub", "packagedDrive", "embeds"]);
}

//...more code...

//but this does not work
function removeStyleSheets() {
  return (
    del(['pub/**/*.css'])  
  ); 
}

//...more code...


//BUILD

exports.buildProd = series(
  genClean,
  parallel(
    genCSS,
    genViews.content,
    removeStyleSheets
  )
);


//WATCH

exports.watcher = series(
  genClean,
  parallel(
    genCSS,
    genViews.content,
    removeStyleSheets
  ),
  bSync
);

based on the del API docs, I also tried...

function removeStyleSheets() {
  return (
     (async () => {
      const deletedFilePaths = await del(['pub/*.css'], {dryRun: true});
      console.log('Deleted files:\n', deletedFilePaths.join('\n'));
    })()
  ); 
 }

and also tried...

function removeStyleSheets() {
  return (
    (async () => {
      const deletedFilePaths = await del(['pub/*.css', '!pub/*.html']);
      console.log('Deleted files:\n', deletedFilePaths.join('\n'));
    })()
  ); 
 }

But my files are still showing up...

• gulp

1 Answer 1

This was almost mission impossible.

Had to create a custom function, to then pass it into a pipe process, so that the event is guaranteed to occur after my pub folder exists with files in it. Then run the del process.

Here is a short example of my working pipe process...

const { src, dest, watch, parallel, series } = require("gulp");
const mPub = "./pub";
const del = require("del");
const through = require('through2')


//...more packages, paths and code...


/* In my situation, from within my HTML template task function, 
give it this additional pipe process 
only after files are pushed to /pub...
*/

    //..
    .pipe(dest(mPub)),
    .pipe(through.obj((chunk, enc, cb) => {
          del(['./pub/**/*.css'])
          cb()
     }))
    //...