Gulp 中的 TypeScript 编译器说它找不到 @angular 模块但编译得很好答案

【问题标题】：TypeScript compiler in Gulp says it cannot find @angular modules but compiles fineGulp 中的 TypeScript 编译器说它找不到 @angular 模块但编译得很好
【发布时间】：2016-09-03 08:43:05
【问题描述】：

当我的gulp 任务编译我的打字稿时，我收到了很多“错误”错误。这是相关的gulp task：

var tsProject = typescript.createProject('tsconfig.json', {noResolve: true});

gulp.task('build-ts', function() {
    gulp.src(appDev + '**/*.ts')
        .pipe(sourcemaps.init())
        .pipe(typescript(tsProject))
        .pipe(sourcemaps.write())
        //.pipe(jsuglify())
        .pipe(gulp.dest(appProd));
    gulp.src(appDev + '**/*.+(html|css)')
        .pipe(gulp.dest(appProd));
});

这些是我得到的错误：

[09:38:52] Starting 'default'...
[09:38:52] Finished 'default' after 8.88 ms
ng/app.component.ts(1,27): error TS2307: Cannot find module '@angular/core'.
ng/app.component.ts(5,12): error TS2304: Cannot find name 'module'.
ng/app.module.ts(1,26): error TS2307: Cannot find module '@angular/core'.
ng/app.module.ts(2,31): error TS2307: Cannot find module '@angular/platform-browser'.
ng/app.module.ts(3,31): error TS2307: Cannot find module '@angular/common'.
[...]
[09:38:53] TypeScript: 27 semantic errors
[09:38:53] TypeScript: emit succeeded (with errors)
[BS] Proxying: http://0.0.0.0:5000

我的树形结构看起来像这样（简化）：

.
├── gulpfile.js
├── ng
├── node_modules
├── package.json
├── tsconfig.json
├── typings.json
└── web

Typescript 编译器找不到的所有模块实际上都在 node_modules 中，尽管有所有错误，我的最终应用程序都可以正常工作。

这是我的tsconfig.js：

{
  "compilerOptions": {
    "target": "ES5",
    "module": "commonjs",
    "moduleResolution": "node",
    "sourceMap": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "removeComments": false,
    "noImplicitAny": false,
    "outDir": "./app"
  },
  "filesGlob": [
    "./app/**/*.ts",
    "!./node_modules/**/*.ts"
  ],
  "exclude": [
    "node_modules",
    "typings/main",
    "typings/main.d.ts"
  ],
  "atom": {
    "rewriteTsconfig": true
  }
}

我怎样才能摆脱这些“误报”错误。

【问题讨论】：

我认为传递给打字稿编译的文件有问题。一方面，您传递您的appDev 文件并设置noResolve。另一方面，您的tsconfig 中有不同的配置。（注意：文件和排除不能一起工作，而且你的 tsconfig 也不会被 gulp 重写！）如果你对类型的解析有问题，你可以在 typescript 编译器调用中添加 traceResolution 标志。那应该给你一些提示。见github.com/Microsoft/TypeScript-Handbook/blob/master/pages/…。
您还应该查看您传递的noResolve 选项。这会导致不遵循对未传递给 TypeScript 编译器的文件的任何导入。 github.com/Microsoft/TypeScript-Handbook/blob/master/pages/…。我建议不要gulp.src，而是从tsproject 开始作为事实来源：github.com/ivogabe/gulp-typescript#using-tsconfigjson

标签： angular typescript gulp

【解决方案1】：

在 gulp.js 文件中的行

var tsProject = typescript.createProject('tsconfig.json', {noExternalResolve: true, noResolve: true});

应该是

var tsProject = typescript.createProject('tsconfig.json');

因为我们要加载外部类型。

您还需要在顶部的 main.ts 文件中加载类型：

/// <reference path="../typings/index.d.ts" />

我确实克隆了您的项目，并且在此之后它编译时没有警告。

【讨论】：

有趣的是，我之前曾独立尝试过这两件事。谢谢！
我之前告诉过你是因为打字，但不知道你的整个配置:)
Typings 不应包含在引用中，而应直接包含在 tsconfig 或您的构建链中。