So far, in Part I we read about the motivations and the targets we want to hit with our automation.

Packing up the goods

Being a PhoneGap Build (PGB) private application, we need to upload a .zip file that contains everything we need to build the app for a given environment.
So, creating a .zip file with the app and assets it is.

We follow the default ionic source tree structure:

which means having the config.xml outside the /www folder (as PGB expects). Besides, both the config.xml and the angular services have to be “configured” for the environment they are to be deployed to, so we took the approach of copying everything we needed to a temporary location (tmp/) and create the .zip file for that location (previous cleaning it).

First challenge, harvest command line arguments. Gulp does not have a built-in, standard way, so we chose the yargs package that exposes them from the argv variable.
config is a module we built that exposes variables and utility functions that deal with configuration of the process.
Second challenge is the parallelize-everything mindset of Gulp, that offers no guarantee that a dependent task has finished before the executed task begins. In our case we definitely wanted to finish up “mirroring” the artifacts into tmp/ before performing file transformations or start packing. To achieve such simple requirement we used gulp-sync that offers the gulpsync.sync(['t1', 't2', …]) syntax.
We use gulp-zip to compress the files in tmp/, but the dependencies are interesting in themselves.

mirror copies just the files we need to build (minified versions) and makes heavy usage of inclusion and exclusion of globs. Word of advice, copy just what is needed and optimize your images. We ended up from a 60MB app to a still heavy 10MB (thanks you, high-res displays) and I cannot tell you how much faster that is.
Another interesting feature is, since we are using TFS, we have those dreaded read-only flags on files that would prevent manipulating the content of the files, so gulp-chmod allows to remove the flag when copied.

config transforms the config.xml file with the variables known at build time, such as version and application namespace. To “poke” the content of the files we use gulp-replace. services does the same for for our services.js file for replacing the tokens such as API endpoints and the like from the source code itself.

The end result is a .zip file that can be uploaded to PGB and it will compile.