[angular] 각도 및 타이프 스크립트 : 이름을 찾을 수 없습니다

TypeScript (버전 1.6)와 함께 Angular (버전 2)를 사용하고 있으며 코드를 컴파일 할 때 다음 오류가 발생합니다.

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.tsTypeScript에 내재적으로 포함 된 파일은 컴파일 대상에 따라 다르므로 es5실제로 런타임에 항목이 존재하더라도 대상을 지정할 때 주변 선언이 더 필요합니다 (예 : 크롬). 더lib.d.ts

답변

2.0.0-beta.6 (2016-02-11) 에 대한 변경 사항 로그에 언급 된 해결 방법이 있습니다 (변경 사항 아래에 나열 됨).

–target = es5를 사용하는 경우 응용 프로그램 어딘가에 줄을 추가해야합니다 (예 : 부트 스트랩을 호출하는 .ts 파일의 맨 위에).

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

(파일이 node_modules와 같은 디렉토리에 있지 않으면 해당 경로의 시작 부분에 하나 이상의 ../를 추가해야합니다.)

올바른 참조 경로가 있는지 확인하십시오 .이 작업을 시작하려면 시작에 ../ 를 추가 해야했습니다.

답변

약속과 같은 ES6 기능은 ES5를 타겟팅 할 때 정의되지 않습니다. 다른 라이브러리가 있지만 core-js는 Angular 팀이 사용하는 자바 스크립트 라이브러리입니다. 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"
  ]
}

다른 답변에서 설명한 것처럼 타이핑을 사용하는 것보다 훨씬 쉽습니다. 자세한 내용은 Microsoft 블로그 게시물을 참조하십시오. Typescript : 선언 파일의 미래

답변

Angular2 튜토리얼을 따르는 사람들 angular.io을 위해 명시 적으로 설명하기 위해 코드를 넣을 위치에 대한 mvdluit의 답변이 확장되었습니다.

당신 main.ts은 다음과 같이 보일 것입니다 :

/// <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

답변

나는 다음 명령으로 이것을 고칠 수 있었다

typings install es6-promise es6-collections --ambient

주 당신이 필요로하는 것을 typings위의 명령 작업을하기 위해, 당신은 그것을 설치하려면 다음 명령을 실행하지 않은 경우

npm install -g typings

최신 정보

typings 업데이트는 읽지 않습니다 --ambient이 된 --global바로 다음 명령을 사용하여 위의 라이브러리의 정의를 설치해야합니다 일부 사람들도

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

이것을 지적한 @bgerth 에게 감사드립니다 .

답변

Typescript> = 2 인 경우 tsconfig.json의 “lib”옵션이 작업을 수행합니다. 타이핑이 필요 없습니다. https://www.typescriptlang.org/docs/handbook/compiler-options.html

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

답변

대한 Angular 2.0.0-rc.0추가 node_modules/angular2/typings/browser.d.ts작동하지 않습니다. 먼저 다음 내용을 사용하여 typings.json 파일 을 솔루션에 추가 하십시오.

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

그런 다음 package.json파일을 업데이트하여 다음 을 포함하십시오 postinstall.

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

이제 실행 npm install

또한 파일의 typings폴더도 무시해야 tsconfig.json합니다.

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

최신 정보

이제 AngularJS 2.0 core-js대신을 사용 하고 es6-shim있습니다. 자세한 정보 는 빠른 시작 typings.json 파일 을 따르십시오 .