Vraag Angular en Typescript: Kan namen niet vinden


Ik gebruik Angular (versie 2) met TypeScript (versie 1.6) en bij het compileren van de code krijg ik de volgende foutmeldingen:

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'.

Dit is de code:

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);

192
2017-10-25 16:58


oorsprong


antwoorden:


Een bekend probleem: https://github.com/angular/angular/issues/4902 

Belangrijkste reden: de .d.ts bestand dat impliciet is opgenomen door TypeScript, varieert met het compileerdoel, dus moet u meer omgevingsverklaringen hebben bij het richten es5 zelfs als dingen daadwerkelijk aanwezig zijn in de looptijden (bijvoorbeeld chroom). Meer lib.d.ts


51
2017-10-27 04:16



Er is een work-around genoemd in de changelog voor 2.0.0-beta.6 (2016-02-11) (vermeld onder brekingswijzigingen):

Als u --target = es5 gebruikt, moet u ergens in uw toepassing een regel toevoegen (bijvoorbeeld bovenaan het .ts-bestand waar u bootstrap aanroept):

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

(Merk op dat als uw bestand niet in dezelfde map staat als node_modules, u een of meer ../ aan het begin van dat pad moet toevoegen.)

zorg ervoor dat je het juiste referentiepad hebt, ik moest toevoegen ../ aan het begin om dit te laten werken.


102
2018-02-19 20:34



ES6-functies zoals beloften zijn niet gedefinieerd bij het richten op ES5. Er zijn andere bibliotheken, maar core-js is de javascript-bibliotheek die het Angular-team gebruikt. Het bevat polyfills voor ES6.

Hoek 2 is veel veranderd sinds deze vraag werd gesteld. Type verklaringen zijn veel gemakkelijker te gebruiken in Typescript 2.0.

npm install -g typescript

Voor ES6-functies in Angular 2 hebt u geen typen nodig. Gebruik gewoon typescript 2.0 of hoger en installeer @ types / core-js met npm:

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

Voeg vervolgens de TypeRoots en Soorten attributen aan je 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"
  ]
}

Dit is veel eenvoudiger dan het gebruik van Typings, zoals uitgelegd in andere antwoorden. Zie Microsoft's blogpost voor meer info: Typescript: de toekomst van declaratiebestanden 


79
2018-06-11 01:03



Voor degenen die de zelfstudie van Angular2 volgen angular.io gewoon om expliciet te zijn, hier is een uitbreiding van het antwoord van mvdluit van waar precies de code te zetten is:

Jouw main.ts zou er als volgt uit moeten zien:

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

Merk op dat je weggaat in de /// slashes naar voren, verwijder ze niet.

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


48
2018-03-02 02:41



Ik kon dit met het volgende bevel oplossen

typings install es6-promise es6-collections --ambient

Merk op dat je nodig hebt typings om de bovenstaande opdracht te laten werken, voert u de volgende opdracht uit om de opdracht te installeren als u deze niet hebt

npm install -g typings

BIJWERKEN

typingsupdate leest niet --ambient het werd --global ook voor sommige mensen moet je de definities van de bovenstaande bibliotheken installeren, gebruik gewoon de volgende opdracht

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

Dankzij @bgerth om dit aan te wijzen.


48
2018-05-15 11:14



Wanneer u Typescript> = 2 heeft, zal de "lib" -optie in tsconfig.json het werk doen. Typen is niet nodig. https://www.typescriptlang.org/docs/handbook/compiler-options.html

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

30
2018-01-12 08:18



Voor Angular 2.0.0-rc.0 toe te voegen node_modules/angular2/typings/browser.d.ts zal niet werken. Voeg eerst toe typings.json-bestand naar uw oplossing, met deze inhoud:

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

En werk dan het package.json bestand om dit op te nemen postinstall:

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

Ren nu npm install

Ook nu zou je het moeten negeren typings map in uw tsconfig.json bestand ook:

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

Bijwerken

Nu gebruikt AngularJS 2.0 core-js in plaats van es6-shim. Volg de snelle start typings.json-bestand voor meer informatie.


15
2018-05-03 08:45



je kunt de code aan het begin van .ts-bestanden toevoegen.

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

13
2018-06-13 04:55