Kątowy i maszynopis: nie można znaleźć nazw

Używam Angulara (wersja 2) z TypeScript (wersja 1.6) i kiedy kompiluję kod, dostaję następujące błędy:

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

To jest kod:

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

Znany problem: https://github.com/angular/angular/issues/4902

Główny powód: .d.tsplik domyślnie zawarty w TypeScript różni się w zależności od celu kompilacji, więc podczas celowania trzeba mieć więcej deklaracji otoczenia, es5nawet jeśli rzeczywiscie są obecne w środowiskach wykonawczych (np. Chrome). Więcej nalib.d.ts

W dzienniku zmian dla wersji 2.0.0-beta.6 (2016-02-11) wymieniono obejście (wymienione w części „Przełomowe zmiany”):

Jeśli użyjesz opcji --target = es5, musisz dodać linię w aplikacji (na przykład u góry pliku .ts, w którym wywołujesz bootstrap):

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

(Pamiętaj, że jeśli twój plik nie znajduje się w tym samym katalogu, co moduły_węzła, musisz dodać jeden lub więcej ../ na początku tej ścieżki).

upewnij się, że masz prawidłową ścieżkę referencyjną, musiałem dodać ../ na początku, aby uzyskać to działające.

Funkcje ES6, takie jak obietnice, nie są zdefiniowane podczas celowania w ES5. Istnieją inne biblioteki, ale core-js to biblioteka javascript, której używa zespół Angular. Zawiera wieloskładniki dla ES6.

Angular 2 bardzo się zmienił od czasu zadania tego pytania. Deklaracje typów są znacznie łatwiejsze w użyciu w Typescript 2.0.

npm install -g typescript

W przypadku funkcji ES6 w Angular 2 nie potrzebujesz Pisania. Wystarczy użyć pisma maszynowego 2.0 lub nowszego i zainstalować @ typy / core-js z npm:

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

Następnie dodaj atrybuty TypeRoots i Types do pliku 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"
  ]
}

Jest to o wiele łatwiejsze niż używanie Typów, jak wyjaśniono w innych odpowiedziach. Zobacz post na blogu Microsoftu, aby uzyskać więcej informacji: Typescript: The Future of Declaration Files

Dla tych, którzy postępują zgodnie z samouczkiem Angular2, angular.ioaby być jawnym, oto rozszerzenie odpowiedzi mvdluit, gdzie dokładnie należy umieścić kod:

Twój main.tspowinien wyglądać tak:

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

Pamiętaj, że zostawiasz ///ukośniki, nie usuwaj ich.

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

Udało mi się to naprawić za pomocą następującego polecenia

typings install es6-promise es6-collections --ambient

Pamiętaj, że musisz typingssprawić, by powyższe polecenie działało, jeśli go nie masz, uruchom następujące polecenie, aby je zainstalować

npm install -g typings

AKTUALIZACJA

aktualizacja typów nie czyta --ambient, stało się to --globalrównież dla niektórych osób, które muszą zainstalować definicje powyższych bibliotek, wystarczy użyć następującego polecenia

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

Dzięki @bgerth za zwrócenie na to uwagi.

Jeśli masz Typescript> = 2, opcja „lib” w tsconfig.json wykona zadanie. Nie ma potrzeby pisania. https://www.typescriptlang.org/docs/handbook/compiler-options.html

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

Dla Angular 2.0.0-rc.0dodawania node_modules/angular2/typings/browser.d.tsnie będzie działać. Najpierw dodaj plik typings.json do swojego rozwiązania z następującą zawartością:

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

A następnie zaktualizuj package.jsonplik, aby zawierał to postinstall:

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

Teraz biegnij npm install

Teraz również powinieneś zignorować typingsfolder w swoim tsconfig.jsonpliku:

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

Aktualizacja

Teraz AngularJS 2.0 używa core-jszamiast es6-shim. Aby uzyskać więcej informacji, postępuj zgodnie z jego plikiem szybkiego startu typings.json .

możesz dodać kod na początku plików .ts.

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

Dostałem to na Angular 2 rc1. Okazuje się, że niektóre nazwy zostały zmienione przy użyciu wersji v1 w stosunku do starego 0.x. Te browser.d.tspliki stałindex.d.ts .

Po bieganiu typings install zlokalizuj plik startowy (w którym ładujesz) i dodaj:

/// <reference path="../typings/index.d.ts" /> (lub bez ../ jeśli plik startowy znajduje się w tym samym folderze, co folder z typami)

Dodawanie index.d.tsdo listy plików wtsconfig.json nie działało z jakiegoś powodu.

Ponadto es6-shimpakiet nie był potrzebny.

Udało mi się to naprawić, instalując typingsmoduł.

npm install -g typings
typings install

(Korzystanie z ng 2.0.0-rc.1)

Miałem ten sam problem i rozwiązałem go za pomocą libopcji w tsconfig.json. Jak powiedział basarat w swojej odpowiedzi , .d.tsplik jest domyślnie dołączony przez TypeScript w zależności od targetopcji kompilacji , ale to zachowanie można zmienić za pomocąlib opcji.

Można określić dodatkowe pliki definicji, które mają zostać dołączone, bez zmiany docelowej wersji JS. Na przykład jest to część mojego aktualnego compilerOptionsdla [email protected] i dodaje obsługę es2015funkcji bez instalowania czegokolwiek innego:

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

Aby uzyskać pełną listę dostępnych opcji, sprawdź oficjalny dokument .

Zauważ też, że dodałem "types": ["node"]i zainstalowałem, npm install @types/nodeaby obsługiwać require('some-module')mój kod.

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

i dodaj poprawną ścieżkę do index.d.ts

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

Próbowałem na @ angular-2.0.0-rc3

Jeśli npm install -g typings typings installnadal nie pomaga, usuń foldery_węzłów i typów, zanim wykonasz to polecenie.

Właśnie dlatego pomyśl, jak każdy próbuje zrobić coś innego. Wierzę, że te systemy wciąż są dalekie od ostatecznej wersji.

W moim przypadku zaktualizowałem z rc.0 do rc.5 ten błąd pojawił się.

Moją stałą zmianą była zmiana pliku 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"
    ]
}

dodaj typing.d.ts w głównym folderze aplikacji, a tam zadeklaruj zmienną, której chcesz używać za każdym razem

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

po zadeklarowaniu tego podczas pisania.d.ts, błąd wymagający nie pojawi się w aplikacji.

Jestem nowy w Angular, ale dla mnie rozwiązanie zostało znalezione przez po prostu importowanie danych wejściowych. Nie mogę przypisać sobie tego, znalazłem go na innej tablicy. Jest to prosta poprawka, jeśli masz ten sam problem, ale jeśli Twoje problemy są bardziej złożone, przeczytam powyższe informacje.

Mukesh :

musisz zaimportować takie dane wejściowe w górnej części elementu potomnego

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

Znalazłem ten bardzo pomocny dokument na stronie Angular 2. W końcu pozwoliło mi to działać poprawnie, podczas gdy inne odpowiedzi tutaj, aby zainstalować typowanie, zawiodły mnie różnymi błędami. (Ale pomógł poprowadzić mnie we właściwym kierunku).

Zamiast dołączania kolekcji es6-promise i es6, zawiera core-js, co załatwiło sprawę ... bez konfliktów z podstawowymi definicjami ts Angular2. Ponadto dokument wyjaśnił, jak skonfigurować to wszystko, aby działo się to automatycznie podczas instalowania NPM i jak modyfikować plik typings.json.

Angular 2 RC1 zmienił nazwę node_modules/angular2katalogu na node_modules/angular.

Jeśli używasz pliku gulpfile do kopiowania plików do katalogu wyjściowego, który prawdopodobnie nadal masz node_modules/angular tam siedzisz, co może zostać odebrane przez kompilator i dezorientować się samo z siebie.

Więc (ostrożnie) wyczyść to, co masz w node_moduleswersji beta, a także usuń wszystkie stare typy i uruchom ponownie typings install.

Dobra rozmowa, @ VahidN, uznałem, że potrzebuję

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

W moim tsconfigteż, aby zatrzymać błędy od es6-shimsiebie

Zaimportuj poniższą instrukcję do pliku JS.

import 'rxjs/add/operator/map';

Przyjęta odpowiedź nie zapewnia realnej poprawki, a większość pozostałych sugeruje obejście „potrójnych cięć”, które nie jest już wykonalne, ponieważ browser.d.tszostało usunięte przez najnowsze RC Angular2 i dlatego nie jest już dostępne.

Zdecydowanie sugeruję zainstalowanie typingsmodułu zgodnie z sugestią kilku rozwiązań tutaj, ale nie jest to konieczne, aby zrobić to ręcznie lub globalnie - istnieje skuteczny sposób, aby to zrobić tylko dla twojego projektu i w interfejsie VS2015. Oto, co musisz zrobić:

• Dodaj typings w pliku package.json projektu.
• dodaj scriptblok do package.jsonpliku, aby wykonać / zaktualizować typingspo każdej akcji NPM.
• dodaj typings.jsonplik do folderu głównego projektu zawierający odniesienie do core-js(ogólnie lepiej niż es6-shimatm).

Otóż ​​to.

Możesz także zajrzeć do tego innego wątku SO i / lub przeczytać ten post na moim blogu, aby uzyskać dodatkowe informacje.

Ten błąd pojawiał się po scaleniu mojej gałęzi deweloperskiej z moją bieżącą gałęzią. Spędziłem trochę czasu, aby rozwiązać problem. Jak widać na poniższym obrazku, kody nie mają żadnego problemu.

Więc jedyna poprawka, która zadziałała, to ponowne uruchomienie VSCode

Teraz musisz je zaimportować ręcznie.

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

Zaktualizuj tsconfig.json, zmień

"target": "es5"

do

"target": "es6"