build only if modified: gulp browserify babelify sourcemap uglify print size (example)

gulpfile.js

//example - change the paths
function CompileJsAtPath(jsFile, debug){

  return new Promise(function(resolve, reject){

    //best example is from https://github.com/gulpjs/gulp/blob/master/docs/recipes/browserify-uglify-sourcemap.md
    //deps
    const uglify = require('gulp-uglify');
    const sourcemaps = require('gulp-sourcemaps');
    //get current filename
    const fileName = jsFile.split('/').pop();
    //init browserify for this file
    var b = require('browserify')({
      entries: `.${jsFile}`,
      debug: debug, //sourcemap
      paths: ['./node_modules','./_/logic']
    });
    //exclude core libs we reference globally
    b.exclude('knockout');
    b.exclude('jquery');
    //get reference to pipeline
    var op =
    //babelify
    b.transform(require('babelify'))
    //perform browserify
    .bundle()
    //report browserify error
    .on('error', function(err) {

      OnError('JS: ' + jsFile, err);
      reject(err);
    });
    //adjust sourcemap to saved location
    if (debug)
      op.pipe(require('mold-source-map').transformSourcesRelativeTo('_/logic/build/'));
    //convert to stream
    op.pipe(require('vinyl-source-stream')(fileName))
    //buffer stream for sourcemap
    .pipe(require('vinyl-buffer')())
    //load in the sourcemap from browserify
    .pipe(sourcemaps.init({loadMaps: true}))
    //uglify when we want to (takes a few extra seconds)
    .pipe( uglify({
      compress: false,
      ie_proof: false
    }) )
    //write sourcemap to separate location
    .pipe(sourcemaps.write('./', {sourceRoot: '/', includeContent: false}))
    .pipe(size({ showFiles: true, showTotal: false }))
    //write out the js file to build
    .pipe(gulp.dest('_/logic/build/'))
    .on('finish', function(){

      OnComplete('JS: ' + jsFile);
      resolve()
    })
  });
}

function RunWhenNewer(globsToMonitor, outputFileTimeCheck, taskToRun, cb) {

  return gulp.src(globsToMonitor, {read: false})
  .pipe(newer(outputFileTimeCheck))
  .pipe(gutil.buffer(function(err, files) {

    //handle error
    if (err)
      console.error(err);
    //if any files changed, run task
    console.log(globsToMonitor, outputFileTimeCheck, files);
    if (files.length) {
      gulp.series(taskToRun, function(done) { cb(); done(); })();
    }
    else {
      cb();
    }
  }));
}

const pageAScriptGlobs = ['_/logic/**/*.js','!_/logic/build/**', '!_/logic/OtherPage/**'];
//specific task to build scripts for 'Page A' only when required
gulp.task('script-A-ifneeded', function(done){

  RunWhenNewer(pageAScriptGlobs, '_/logic/build/page-a.js', 'script-ide', done);
});
//actual build task to build scripts for 'Page A'
gulp.task('script-a', function(){

  return CompileJsAtPath('/_/logic/page-a.js', true)
});
//default only build what's changed
gulp.task('default', gulp.parallel('script-a-ifneeded'));
//option to force build everything
gulp.task('force', gulp.parallel('script-a'));
gulp.task('watch', function(){

  	var debounce = require('debounce');
    //we must debounce since the debouncedelay option for gulp watch only debounces exact file duplications, and here we only want to run the operation once for each type of file since the operation builds every file in the matching glob
    //Page 'A' js change
    gulp.watch(
      pageAScriptGlobs,
      debounce(gulp.parallel('script-a'), 50));
});