Visual Studio 代码抱怨它 "Cannot find namespace" 对于 *.d.ts 文件中定义的类型

Question

我使用 gulp-angular Yeoman generator with language set to TypeScript. Then ran the Gulp 构建过程创建了一个新项目，并在 Web 浏览器中打开了该页面，一切正常，没有出现任何更大的问题。我只需将 tsd.json 中的 ref: "master" 替换为 ref: "1.4.1" 即可使构建工作。基本上我执行了以下命令：

yo gulp-angular
vim tsd.json
gulp
gulp serve
code .

之后我在Visual Studio Code中打开了项目。

现在，Visual Studio 代码抱怨，例如，它 "Cannot find namespace 'ng'" 每次出现 AngularJS data types are used. It also complains about MomentJS 和 [=22 中定义的其他类型=] 文件。

项目的 tsd.json 如下所示：

{
  "version": "v4",
  "repo": "borisyankov/DefinitelyTyped",
  "ref": "1.4.1",
  "path": ".tmp/typings",
  "bundle": ".tmp/typings/tsd.d.ts"
}

.tmp/typings 文件夹包含以下文件：

angular-ui-router/angular-ui-router.d.ts
angularjs/angular-animate.d.ts
angularjs/angular-cookies.d.ts
angularjs/angular-mocks.d.ts
angularjs/angular-resource.d.ts
angularjs/angular-sanitize.d.ts
angularjs/angular.d.ts
jquery/jquery.d.ts
moment/moment-node.d.ts
moment/moment.d.ts
toastr/toastr.d.ts
tsd.d.ts

举一个 Visual Studio 代码出错的源文件的例子，这里是 navbar.directive.ts 文件：

module editorTs {
  'use strict';

  /** @ngInject */
  export function acmeNavbar(): ng.IDirective {

    return {
      restrict: 'E',
      scope: {
        creationDate: '='
      },
      templateUrl: 'app/components/navbar/navbar.html',
      controller: NavbarController,
      controllerAs: 'vm',
      bindToController: true
    };

  }

  /** @ngInject */
  class NavbarController {
    public relativeDate: string;

    constructor(moment: moment.MomentStatic) {
      this.relativeDate = moment(1444135396045).fromNow();
    }
  }
}

在此文件中 Visual Studio 代码抱怨 ng.IDirective 类型 "Cannot find namespace 'ng'" 并且抱怨 moment.MomentStatic 输入 "Cannot find namespace 'moment'".

编辑：

通过将以下内容添加到 navbar.directive.ts 的顶部来明确引用类型定义文件可解决问题：

/// <reference path="../../../../.tmp/typings/angularjs/angular.d.ts"/>
/// <reference path="../../../../.tmp/typings/moment/moment.d.ts"/>

但这些文件已在 .tmp/tsd.d.ts 中引用，其中包含以下内容：

/// <reference path="angular-ui-router/angular-ui-router.d.ts" />
/// <reference path="angularjs/angular-animate.d.ts" />
/// <reference path="angularjs/angular-cookies.d.ts" />
/// <reference path="angularjs/angular-mocks.d.ts" />
/// <reference path="angularjs/angular-resource.d.ts" />
/// <reference path="angularjs/angular-sanitize.d.ts" />
/// <reference path="angularjs/angular.d.ts" />
/// <reference path="jquery/jquery.d.ts" />
/// <reference path="moment/moment-node.d.ts" />
/// <reference path="moment/moment.d.ts" />
/// <reference path="toastr/toastr.d.ts" />

所以不需要显式引用这些文件？

Answer 1

Cannot find namespace 'ng'"

确保项目不包含对 declare module ng 的引用。暂时相同。

更新

基于问题中的编辑：

Explicitely referencing the type definition files by adding the following to the top of navbar.directive.ts removes the problem

请使用 tsconfig.json : https://basarat.gitbooks.io/typescript/content/docs/project/compilation-context.html

Answer 2

我遇到了同样的问题；似乎打字正在剥离引用 "ng" 导入的原始定义文件。

将此添加回您的原始 angular/index。d.ts 文件：

// Collapse angular into ng import ng = angular;

或者更好的是，将它放在一个 ng.d.ts 文件中，这样它就不会被再次输入覆盖。

Answer 3

在我的 VS Code 项目的根目录中添加 tsconfig.json 可以解决我的问题。此外，不得不重新启动 VS 代码。这是我放入该文件的内容：

{
    "compilerOptions": {
        "target": "es5",
        "module": "commonjs",
        "sourceMap": true
    }
}

有关 tsconfig.json 文件的更多信息，请查看：

https://code.visualstudio.com/docs/languages/typescript

Answer 4

我在代码的隐蔽位置发现了以下内容。可能放在那里以避免类型错误。似乎 vscode 遇到了这个问题，并将全局 'angular' 变量重新定义为 'any'.

的类型

var angular = window['angular'];

Visual Studio 代码抱怨它 "Cannot find namespace" 对于 *.d.ts 文件中定义的类型

Visual Studio Code complains that it "Cannot find namespace" for types defined in *.d.ts files

angularjs

yeoman

typescript

gulp

visual-studio-code

更新