Don't slash your globs the wrong way!

I inherited a couple of AngularJS applications that are built using gulp scripts when I started in my current role. Putting to one side the swathes of repeated code both within the build scripts for the same application (literally huge swathes of code copied and pasted from the script for building the desktop version into the script for building the mobile version) and that had subsequently been copied to other applications, these scripts were, a bit shit. To put it diplomatically. Over the past month we've factored up and out code that's common to building all applications and overall reduced the complexity of the build process - who wouldn't want a simpler build process that produces exactly the same end result, right?

The biggest problem we've had is that all projects were using what can only be described as a franken-version of gulp. Version 4.0.0-alpha.2, to be precise. Upgrading from this version to version 4.0.2 resulted in some very weird things happening around file copies; files that started in app\images\ and should end up in .dev\images\ were ending up in .dev\images\app\images - not helpful! Here's a snippet of the build script in question:

pump([
    gulp.src(['app\\images\\**\\*.*']),
    gulp.dest('.dev\\images')
] , done);

I asked a question on Stack Overflow back at the beginning of June, and after offering a bounty a few days ago finally got an answer... When building gobs, use / as a delimiter, not \ or bad things will happen. Changing the direction of all the slashes resulted in a build that gave the same output, but wasn't using a locally cached (the alpha version doesn't exist on npm!) copy of the package, in a simplified test-harness.

The last hurdle to jump was the fact that these build scripts are run on Wndows and the majority of the globs are generated by using path.join to concatenate their constituent parts. This always gives results that contain \ which complicates things, especially as the scripts contain hundreds of instances of this. Our solution, for now, was to replace:

const join = require('path').join;

With:

const path = require('path');
const join = (...args) => path.join(...args).replace(/\\/g, '/');

With that in place, the main build scripts are now using a "real" version of gulp, the builds are doing what they're expected to and all is once again well. For what it's worth, having dug into the changes it looks like the use of a later version of glob-parent by gulp 4.0.2 is responsible for the change in behaviour.

TL;DR: Use / in globs, not \