带有gulp-typescript的Angular 2提前编译器

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

用Typescript 2.0.2编写的Angular 2 rc 6

我正在尝试学习此处概述的Ahead-of-Time编译。看起来很简单：

运行ngc而不是Typescript编译器来生成.ngfactory.ts文件
将platformBrowserDynamic().bootstrapModule()替换为platformBrowser().bootstrapModuleFactory()

我不确定如何将第一步应用到我的设置中。我使用gulp-typescript 2.13.6将我的打字稿编译为JavaScript。

gulpfile.js

1
2
3
4
5
6
7
8
9
10

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));
});

所以我的问题是；如何将说明集成到我的工具中？如何获得gulp-typescript来使用Angular编译器？我试过了：

1
2
3

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

这将引发错误，而无需运行ngc。我也试过

1
2
3

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

这确实执行ngc，但立即引发错误：

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

我怀疑这是因为没有源目录传递到ngc(所需的命令是ngc -p path/to/project)

基本上，有没有一种方法可以使用gulp-typescript进行一步构建？ (生成.ngfactory.ts文件，然后全部编译为JavaScript)

我想typescript: require(..)不能正常工作的原因是因为gulp-typescript寻找typescript之类的东西或试图运行命令tsc，并且由于angular编译器命令是ngc，所以找不到它。

现在，如果您的项目就像编译一样简单，则可以像这样从gulp运行命令：

1
2
3
4
5
6
7
8
9

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);
});
});

这要求您正确设置tsconfig.json，并在"配置"标题下使用Google此处讨论的潜在其他选项。

如果您需要gulp-typescript软件包提供的更复杂的功能，恐怕您要么不得不自己开发它，要么等待其他人来开发。