我使用Angular(版本2)和TypeScript(版本1.6),当我编译代码时,我得到这些错误:

Error TS2304: Cannot find name 'Map'.
    node_modules/angular2/src/core/change_detection/parser/locals.d.ts(4,42): Error TS2304: Cannot find name 'Map'.
    node_modules/angular2/src/core/facade/collection.d.ts(1,25): Error TS2304: Cannot find name 'MapConstructor'.
    node_modules/angular2/src/core/facade/collection.d.ts(2,25): Error TS2304: Cannot find name 'SetConstructor'.
    node_modules/angular2/src/core/facade/collection.d.ts(4,27): Error TS2304: Cannot find name 'Map'.
    node_modules/angular2/src/core/facade/collection.d.ts(4,39): Error TS2304: Cannot find name 'Map'.
    node_modules/angular2/src/core/facade/collection.d.ts(7,9): Error TS2304: Cannot find name 'Map'.
    node_modules/angular2/src/core/facade/collection.d.ts(8,30): Error TS2304: Cannot find name 'Map'.
    node_modules/angular2/src/core/facade/collection.d.ts(11,43): Error TS2304: Cannot find name 'Map'.
    node_modules/angular2/src/core/facade/collection.d.ts(12,27): Error TS2304: Cannot find name 'Map'.
    node_modules/angular2/src/core/facade/collection.d.ts(14,23): Error TS2304: Cannot find name 'Map'.
    node_modules/angular2/src/core/facade/collection.d.ts(15,25): Error TS2304: Cannot find name 'Map'.
    node_modules/angular2/src/core/facade/collection.d.ts(94,41): Error TS2304: Cannot find name 'Set'.
    node_modules/angular2/src/core/facade/collection.d.ts(95,22): Error TS2304: Cannot find name 'Set'.
    node_modules/angular2/src/core/facade/collection.d.ts(96,25): Error TS2304: Cannot find name 'Set'.
    node_modules/angular2/src/core/facade/lang.d.ts(1,22): Error TS2304: Cannot find name 'BrowserNodeGlobal'.
    node_modules/angular2/src/core/facade/lang.d.ts(33,59): Error TS2304: Cannot find name 'Map'.
    node_modules/angular2/src/core/facade/promise.d.ts(1,10): Error TS2304: Cannot find name 'Promise'.
    node_modules/angular2/src/core/facade/promise.d.ts(3,14): Error TS2304: Cannot find name 'Promise'.
    node_modules/angular2/src/core/facade/promise.d.ts(8,32): Error TS2304: Cannot find name 'Promise'.
    node_modules/angular2/src/core/facade/promise.d.ts(9,38): Error TS2304: Cannot find name 'Promise'.
    node_modules/angular2/src/core/facade/promise.d.ts(10,35): Error TS2304: Cannot find name 'Promise'.
    node_modules/angular2/src/core/facade/promise.d.ts(10,93): Error TS2304: Cannot find name 'Promise'.
    node_modules/angular2/src/core/facade/promise.d.ts(11,34): Error TS2304: Cannot find name 'Promise'.
    node_modules/angular2/src/core/facade/promise.d.ts(12,32): Error TS2304: Cannot find name 'Promise'.
    node_modules/angular2/src/core/facade/promise.d.ts(12,149): Error TS2304: Cannot find name 'Promise'.
    node_modules/angular2/src/core/facade/promise.d.ts(13,43): Error TS2304: Cannot find name 'Promise'.
    node_modules/angular2/src/core/linker/element_injector.d.ts(72,32): Error TS2304: Cannot find name 'Map'.
    node_modules/angular2/src/core/linker/element_injector.d.ts(74,17): Error TS2304: Cannot find name 'Map'.
    node_modules/angular2/src/core/linker/element_injector.d.ts(78,184): Error TS2304: Cannot find name 'Map'.
    node_modules/angular2/src/core/linker/element_injector.d.ts(83,182): Error TS2304: Cannot find name 'Map'.
    node_modules/angular2/src/core/linker/element_injector.d.ts(107,37): Error TS2304: Cannot find name 'Map'.
    node_modules/angular2/src/core/linker/proto_view_factory.d.ts(27,146): Error TS2304: Cannot find name 'Map'.
    node_modules/angular2/src/core/linker/view.d.ts(52,144): Error TS2304: Cannot find name 'Map'.
    node_modules/angular2/src/core/linker/view.d.ts(76,79): Error TS2304: Cannot find name 'Map'.
    node_modules/angular2/src/core/linker/view.d.ts(77,73): Error TS2304: Cannot find name 'Map'.
    node_modules/angular2/src/core/linker/view.d.ts(94,31): Error TS2304: Cannot find name 'Map'.
    node_modules/angular2/src/core/linker/view.d.ts(97,18): Error TS2304: Cannot find name 'Map'.
    node_modules/angular2/src/core/linker/view.d.ts(100,24): Error TS2304: Cannot find name 'Map'.
    node_modules/angular2/src/core/linker/view.d.ts(103,142): Error TS2304: Cannot find name 'Map'.
    node_modules/angular2/src/core/linker/view.d.ts(104,160): Error TS2304: Cannot find name 'Map'.
    node_modules/angular2/src/core/render/api.d.ts(281,74): Error TS2304: Cannot find name 'Map'.
    node_modules/angular2/src/core/zone/ng_zone.d.ts(1,37): Error TS2304: Cannot find name 'Zone'.

这是代码:

import 'reflect-metadata';
import {bootstrap, Component, CORE_DIRECTIVES, FORM_DIRECTIVES} from 'angular2/core';
@Component({
  selector: 'my-app',
  template: '<input type="text" [(ng-model)]="title" /><h1>{{title}}</h1>',
  directives: [ CORE_DIRECTIVES ]
})
class AppComponent {
  title :string;

  constructor() {
    this.title = 'hello angular 2';
  }
}
bootstrap(AppComponent);

一个已知的问题:https://github.com/angular/angular/issues/4902

核心原因:。d。TypeScript中隐式包含的ts文件随着编译目标的不同而不同,所以当目标为es5时,即使在运行时(例如chrome)中确实存在一些东西,也需要有更多的环境声明。更多关于lib.d.ts


在2.0.0-beta.6的更新日志中提到了一个解决方案(2016-02-11)(有重大变动):

如果你使用——target=es5,你需要在你的应用程序的某个地方添加一行(例如,在你调用bootstrap的.ts文件的顶部):

///<reference path="node_modules/angular2/typings/browser.d.ts"/>

(请注意,如果您的文件与node_modules不在同一个目录中,则需要添加一个或多个../到路径的起点。)

确保你有正确的参考路径,我需要添加../开始让它工作。


对于那些学习Angular2教程的人来说。为了明确起见,这里是mvdluit关于在哪里放置代码的答案的扩展:

你的主。t应该是这样的:

/// <reference path="../node_modules/angular2/typings/browser.d.ts" />

import {bootstrap} from 'angular2/platform/browser'
import {AppComponent} from './app.component'
// Add all operators to Observable
import 'rxjs/Rx'

bootstrap(AppComponent);

注意,您在///前斜杠中保留,不要删除它们。

裁判:https://github.com/ericmdantas/angular2-typescript-todo/blob/master/index.ts L1


对于Angular 2.0.0-rc。0添加node_modules/angular2/ types /browser.d。这行不通。首先添加类型。Json文件到您的解决方案,内容如下:

{
    "ambientDependencies": {
        "es6-shim": "github:DefinitelyTyped/DefinitelyTyped/es6-shim/es6-shim.d.ts#7de6c3dd94feaeb21f20054b9f30d5dabc5efabd"
    }
}

然后更新包。Json文件,包括这个postinstall:

"scripts": {
    "postinstall": "typings install"
},

现在运行npm install

另外,现在您应该忽略tsconfig中的typings文件夹。Json文件以及:

 "exclude": [
        "node_modules",
        "typings/main",
        "typings/main.d.ts"
    ]

更新

现在AngularJS 2.0使用core-js代替es6-shim。遵循它的快速开始打字。Json文件获取更多信息。


@VahidN,我找到我需要的了

    "exclude": [
        "node_modules",
        "typings/main",
        "typings/main.d.ts"
    ]

在我的tsconfig中,也可以停止es6-shim本身的错误


我可以通过安装typings模块来解决这个问题。

npm install -g typings
typings install

(使用ng 2.0.0-rc.1)


我可以用下面的命令修复这个问题

typings install es6-promise es6-collections --ambient

注意,要使上面的命令工作,您需要进行类型设置,如果没有,请运行以下命令来安装它

npm install -g typings

更新

类型更新不读取-环境它变成-全局也有些人你需要安装上述库的定义,只需使用下面的命令

typings install dt~es6-promise dt~es6-collections --global --save

感谢@bgerth指出这一点。


我在Angular 2 rc1上得到了这个。事实证明,v1和旧的0.x的类型改变了一些名称。browser.d.ts文件变成了index.d.ts。

在运行类型安装后,找到你的启动文件(你引导的地方)并添加:

/// <引用路径="../ types /index.d. "Ts " />(或者不带../如果你的启动文件和typings文件夹在同一个文件夹中)

将index.d.ts添加到tsconfig文件列表中。Json由于某种原因不能工作。

此外,也不需要es6-shim包。


Angular 2 RC1将node_modules/angular2目录重命名为node_modules/ Angular。

如果你使用gulpfile将文件复制到输出目录,你可能仍然有node_modules/angular在那里,它可能会被编译器拾取,并将自己弄得一团糟。

因此(小心地)清除node_modules中用于beta版本的内容,并删除任何旧的类型并重新运行类型install。


ES6的特性,比如承诺,在针对ES5时没有定义。还有其他库,但core-js是Angular团队使用的javascript库。它包含了ES6的腻子。

自这个问题提出以来,Angular 2已经发生了很大的变化。在Typescript 2.0中,类型声明更容易使用。

npm install -g typescript

对于Angular 2中的ES6特性,你不需要类型。只需使用typescript 2.0或更高版本,并使用npm安装@types/core-js:

npm install --save-dev @types/core-js

然后,将TypeRoots和Types属性添加到tsconfig.json中:

{
  "compilerOptions": {
    "target": "es5",
    "module": "es6",
    "moduleResolution": "node",
    "sourceMap": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "removeComments": false,
    "noImplicitAny": false,
    "typeRoots": [
      "../node_modules/@types"
    ],
    "types" : [
      "core-js"
    ]
  },
  "exclude": [
    "node_modules"
  ]
}

正如在其他回答中解释的那样,这比使用Typings简单得多。更多信息请参见微软的博客文章:Typescript:声明文件的未来


您可以在.ts文件的开头添加代码。

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

我在Angular 2的网站上找到了这个非常有用的文档。它最终让我的东西正常工作,而这里的其他答案,安装类型,我失败了各种错误。(但帮助我找到了正确的方向。)

它没有包含es6-promise和es6-collections,而是包含了core-js,这对我来说很有用……不与Angular2的核心ts定义冲突。此外,该文档还解释了如何在安装NPM时自动设置所有这些,以及如何修改你的类型。json文件。


 typings install dt~es6-shim --save --global

并将正确的路径添加到index.d.ts

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

在@angular-2.0.0-rc3上尝试


公认的答案并没有提供一个可行的解决方案,大多数其他的建议是“三斜杠”的解决方案,这已经不可行了,因为browser.d.ts已经被Angular2最新的RC删除了,因此不再可用。

我强烈建议安装typings模块,就像这里的一些解决方案所建议的那样,但这并不需要手动或全局执行——有一种有效的方法只针对你的项目,并且在VS2015接口中执行。以下是你需要做的:

在项目包中添加类型。json文件。 在包中添加一个脚本块。json文件在每个NPM操作之后执行/更新类型。 添加一个类型。Json文件在项目的根文件夹中包含一个core-js的引用(总体上比es6-shim atm更好)。

就是这样。

你也可以看看这个其他的SO线程和/或阅读我博客上的这篇文章以获得更多的细节。


如果npm install -g typings typings install仍然不起作用,请在执行该命令之前删除node_modules和typings文件夹。


这就是为什么每个人都在尝试做一些不同的事情。我相信这些系统离最终版本还很远。

在我的例子中,我从rc更新。0到rc。5 .出现此错误。

我的修复是改变tsconfig.json。

{
    "compilerOptions": {
        "target": "es6", <-- It was es5
        "module": "system",
        "moduleResolution": "node",
        "sourceMap": true,
        "emitDecoratorMetadata": true,
        "experimentalDecorators": true,
        "removeComments": false,
        "noImplicitAny": false,
        "outDir": "../wwwroot/app"
    },
    "compileOnSave": true,
    "exclude": [
        "../node_modules",
        "../typings/main"
    ]
}

在JS文件中导入下面的语句。

import 'rxjs/add/operator/map';

在应用程序的主文件夹中添加typing.d.ts,并在那里声明你每次都要使用的变量

declare var System: any;
declare var require: any;

在typing.d中声明之后。Ts,在应用程序中不会出现require的错误。


更新tsconfig。json,改变

"target": "es5"

to

"target": "es6"

我也遇到了同样的问题,我使用tsconfig.json中的lib选项解决了它。正如basarat在他的回答中所说,a。d。ts文件被TypeScript隐式包含,这取决于编译目标,但这种行为可以通过lib选项改变。

你可以在不改变目标JS版本的情况下指定要包含的其他定义文件。例如,这是我当前编译选项Typescript@2.1的一部分,它添加了对es2015特性的支持,而不安装任何其他东西:

"compilerOptions": {
    "experimentalDecorators": true,
    "lib": ["es5", "dom", "es6", "dom.iterable", "scripthost"],
    "module": "commonjs",
    "moduleResolution": "node",
    "noLib": false,
    "target": "es5",
    "types": ["node"]
}

要获得可用选项的完整列表,请查看官方文档。

还要注意,我在代码中添加了"types": ["node"],并安装了npm install @types/node来支持require('some-module')。


当Typescript >= 2时,tsconfig中的"lib"选项。Json就可以了。不需要Typings。https://www.typescriptlang.org/docs/handbook/compiler-options.html

{
    "compilerOptions": {
        "target": "es5",
        "lib": ["es2016", "dom"] //or es6 instead of es2016(es7)
    }
}

我是Angular的新手,但对我来说,只需导入Input就能找到解决方案。这不是我的功劳,在另一块黑板上找到的。如果你有同样的问题,这是一个简单的解决方法,但如果你的问题更复杂,我会阅读上面的东西。

穆克什:

你必须像这样在子组件的顶部导入输入

import { Directive, Component, OnInit, Input } from '@angular/core';

现在您必须手动导入它们。

import 'rxjs/add/operator/retry';
import 'rxjs/add/operator/timeout';
import 'rxjs/add/operator/delay';
import 'rxjs/add/operator/map';




this.http.post(url, JSON.stringify(json), {headers: headers, timeout: 1000})

         .retry(2)

         .timeout(10000, new Error('Time out.'))

         .delay(10)

         .map((res) => res.json())
        .subscribe(
          (data) => resolve(data.json()),
          (err) => reject(err)
        );

我得到这个错误后,合并我的开发分支到我的当前分支。我花了一些时间来解决这个问题。正如您在下面的图像中所看到的,代码中根本没有问题。

所以唯一的修复工作为我是重新启动VSCode


这可能是因为您遗漏了一个导入。

例子:

src/app/products/product-list.component.ts:15:15 -错误 TS2304:找不到名称“IProduct”。

确保你在文件的顶部添加了导入:

import { IProduct } from './product';

...

export class ProductListComponent {
    pageTitle: string = 'product list!';
    imageWidth: number = 50;
    imageMargin: number = 2;
    showImage: boolean = false;
    listFilter: string = 'cart';
    products: IProduct[] = ... //cannot find name error