如何为 Angular 2 设置 gulp-typescript？

Question

目前我正在使用 tsc 编译器，带有来自提示符的监视标志。它运行良好，加载所有定义文件并正确编译每个 angular2 文件。不过通过shellwindow用起来很不爽。

我的目标是创建一个 gulp 任务，可以根据 angular2 定义翻译任何打字稿文件。我参与过gulp-typescript，看起来很好用，所以这是代码：

var tsProject = $.typescript.createProject(paths.src + '/tsconfig.json');
gulp.task('typescript', function() {
  gulp
    .src([
      paths.src + '/*.ts'
    ])
    .pipe($.typescript(tsProject)).js
    .pipe(gulp.dest(paths.tmp));
});

这是文件夹结构：

...
src/
---- app/
-------- ts/
------------ *.ts
---- typings/
-------- angular2/
------------ angular2.d.ts
------------ http.d.ts
-------- es6-promise/
------------ ...
-------- rx/
------------ ...
-------- tsd.d.ts
---- *.ts
---- tsconfig.json
gulpfile.js
...

tsconfig 文件没有 files 列表，因此编译器应该检查 src 中的任何 ts 文件（在任何级别）。

调用任务时我收到此错误：

error TS2307: Cannot find module 'angular2/angular2'.
error TS2307: Cannot find module 'angular2/http'.

我如何告诉打字稿编译器使用哪些 d.ts 文件？

Answer 1

您似乎还没有在文件中声明 amd-reference。

尝试在导入模块的文件中声明类似这样的内容：

/// <amd-dependency path="./src/typings/angular2/angular2.d.ts" />
/// <amd-dependency path="./src/typings/angular2/http.d.ts" />

import angular2 = require("angular2");
import http = require("http")

/// <amd-dependency 告诉编译器系统中存在特殊模块并提供无错编译的可能性

Answer 2

我建议向 gulp.src 添加定义。像这样：

var tsProject = $.typescript.createProject(paths.src + '/tsconfig.json');
gulp.task('typescript', function() {
  gulp
    .src([
      paths.src + '/app/**/*.ts',
      paths.src + '/typings/**/*.d.ts'
    ])
    .pipe($.typescript(tsProject)).js
    .pipe(gulp.dest(paths.tmp));
});

Answer 3

这也让我咒骂了一阵子。确保在 tsconfig.json:

的 compilerOptions 节点中有这个

{
  "compilerOptions": {
    "moduleResolution": "node",
  }
}

如何为 Angular 2 设置 gulp-typescript？

How to setup gulp-typescript for Angular 2?

javascript

typescript

ecmascript-6

gulp

angular