Angular 2 Ahead-of-Time Compiler with gulp-typescript

Angular 2 rc 6 written in Typescript 2.0.2

I'm trying to learn Ahead-of-Time compilation as outlined here. It seems simple enough:

• Run ngc instead of the Typescript compiler to generate .ngfactory.ts files
• Replace platformBrowserDynamic().bootstrapModule() with platformBrowser().bootstrapModuleFactory()

I'm not sure how to apply the first step to my setup. I use gulp-typescript 2.13.6 to compile my typescript to JavaScript.

gulpfile.js

var ts = require('gulp-typescript');
var tsProject = ts.createProject('tsconfig.json', {
    //Use TS version installed by NPM instead of gulp-typescript's built-in
    typescript: require('typescript')
});
gulp.task('build-ts', function () {
    return gulp.src(appDev + '**/*.ts')
        .pipe(ts(tsProject))
        .pipe(gulp.dest(appProd));
});

So my question is; how do I integrate the instructions into my tooling? How do I get gulp-typescript to use the Angular Compiler? I've tried:

var tsProject = ts.createProject('tsconfig.json', {
    typescript: require('@angular/compiler') // or '@angular/compiler-cli'
});

This throws errors without ever running ngc. I also tried

var tsProject = ts.createProject('tsconfig.json', {
    typescript: require('./node_modules/.bin/ngc')
});

This does execute ngc but immediately throws error:

SyntaxError: Unexpected string at ngc:2: basedir=$(dirname "$(echo "$0" | sed -e 's,\,/,g')")

I suspect this is because no source directory is passed to ngc (the required command is ngc -p path/to/project)

Basically, is there a way to use gulp-typescript to have a one step build process? (generate .ngfactory.ts files, then compile all to JavaScript)

I imagine the reason why the typescript: require(..) is not working is because gulp-typescript looks for something called typescript or tries to run the command tsc, and since the angular compiler command is ngc, it doesn't find it.

For now, if your project is just as simple as compiling it, you can just run the command from gulp like so:

var exec = require('child_process').exec;

gulp.task('task', function (cb) {
  exec('ngc -p "<path to your tsconfig.json>"', function (err, stdout, stderr) {
    console.log(stdout);
    console.log(stderr);
    cb(err);
  });
});

This requires that you have your tsconfig.json set up correctly, with the potential extra options that Google talk about here, under the Configuration heading.

If you need the more complex functionality that the gulp-typescript package provides, I'm afraid you're either going to have to develop it yourself, or wait for someone else to.