How can I only compile changed/new files?

This script compiles all .js files from the ./src js folder to es6. These are saved individually! The path remains the same, only ./src/js becomes ./build/js. This is important! I do not want to have bundle.js.

When I call this task, every time all .js files are compiled. However, only currently changed files should be compiled. But how? How can I add this into my task?

package.json (part of it):

"paths": {
  "src": {
    "base": "./src/",
    "css": "./src/css/",
    "json": "./src/json/",
    "js": "./src/js/",
    "scss": "./src/scss/"
  },
  "dist": {
    "base": "./public/",
    "css": "./public/css/",
    "js": "./public/js/",
    "material": "./public/js/@material/"
  },
  "build": {
    "base": "./build/",
    "css": "./build/css/",
    "js": "./build/js/",
    "html": "./build/html/"
  }
},
"globs": {
  "babelJs": [
    "./src/js/**/*.js"
  ] 
}

gulpfile.js:

gulp.task('js-babel', function() {
  console.log($.chalk.yellow.bold('--> Transpiling Javascript via Browserify & Babelify...'));
  let files = $.glob.sync(''+pkg.globs.babelJs+'');
  // map them to  streams
  let tasks = files.map(function(entry) {
      return $.browserify({ entries: [entry] })
          .transform('babelify')
          .bundle()
          .pipe($.vinylSourceStream(entry))
          .pipe($.flatten()) // Important!!!!
          .pipe(gulp.dest(pkg.paths.build.js))
          .pipe($.size({gzip: true, showFiles: true}));
    });
    // merge
    return $.eventStream.merge.apply(null, tasks);
});

[goto-bus-stop]

browserify looks like the wrong tool to use from that code snippet. You should not use browserify on every source file. You should only call it on your entry point(s) and generate a single bundle (or multiple bundles if they get too big). If you want to compile files with babel, and not create browser bundles that include all dependencies, use gulp-babel instead of browserify. Then use gulp-newer to only compile changed files.

watchify can be used during development to automatically and quickly rebuild the bundle when files change.

[ronakrathod18]

@goto-bus-stop - thanks a lot! I will give this a try 😃