web-dev-qa-db-ja.com

Angular:Promise、Map、Set、およびIteratorが見つかりません

Angularをインストールした後も、TypeScriptコンパイラはPromiseMapSetIteratorが見つからないというエラーをいくつか繰り返します。

今までは無視していましたが、コードを機能させるためにはPromiseが必要です。

import {Component} from 'angular2/core';
@Component({
    selector: 'greeting-cmp',
    template: `<div>{{ asyncGreeting | async}}</div>`
})
export class GreetingCmp {
    asyncGreeting: Promise<string> = new Promise(resolve => {
// after 1 second, the promise will resolve
        window.setTimeout(() => resolve('hello'), 1000);
    });
}

Additional information:
npm -v is 2.14.12
node -v is v4.3.1
TypeScript v is 1.6

エラー:

................ERROS OF MY CODE.................
    C:\Users\armyTik\Desktop\angular2\greeting_cmp.ts
    Error:(7, 20) TS2304: Cannot find name 'Promise'.
    Error:(7, 42) TS2304: Cannot find name 'Promise'.
    .........................................
    C:\Users\armyTik\Desktop\angular2\node_modules\angular2\platform\browser.d.ts
    Error:(77, 90) TS2304: Cannot find name 'Promise'.
    C:\Users\armyTik\Desktop\angular2\node_modules\angular2\src\core\application_ref.d.ts
    Error:(83, 60) TS2304: Cannot find name 'Promise'.
    Error:(83, 146) TS2304: Cannot find name 'Promise'.
    Error:(96, 51) TS2304: Cannot find name 'Promise'.
    Error:(96, 147) TS2304: Cannot find name 'Promise'.
    Error:(133, 90) TS2304: Cannot find name 'Promise'.
    Error:(171, 81) TS2304: Cannot find name 'Promise'.
    C:\Users\armyTik\Desktop\angular2\node_modules\angular2\src\core\change_detection\parser\locals.d.ts
    Error:(3, 14) TS2304: Cannot find name 'Map'.
    Error:(4, 42) TS2304: Cannot find name 'Map'.
    C:\Users\armyTik\Desktop\angular2\node_modules\angular2\src\core\debug\debug_node.d.ts
    Error:(14, 13) TS2304: Cannot find name 'Map'.
    Error:(24, 17) TS2304: Cannot find name 'Map'.
    Error:(25, 17) TS2304: Cannot find name 'Map'.
    C:\Users\armyTik\Desktop\angular2\node_modules\angular2\src\core\di\provider.d.ts
    Error:(436, 103) TS2304: Cannot find name 'Map'.
    Error:(436, 135) TS2304: Cannot find name 'Map'.
    C:\Users\armyTik\Desktop\angular2\node_modules\angular2\src\core\linker\compiler.d.ts
    Error:(12, 50) TS2304: Cannot find name 'Promise'.
    Error:(16, 41) TS2304: Cannot find name 'Promise'.
    C:\Users\armyTik\Desktop\angular2\node_modules\angular2\src\core\linker\dynamic_component_loader.d.ts
    Error:(108, 136) TS2304: Cannot find name 'Promise'.
    Error:(156, 150) TS2304: Cannot find name 'Promise'.
    Error:(197, 128) TS2304: Cannot find name 'Promise'.
    Error:(203, 127) TS2304: Cannot find name 'Promise'.
    Error:(204, 141) TS2304: Cannot find name 'Promise'.
    Error:(205, 119) TS2304: Cannot find name 'Promise'.
    C:\Users\armyTik\Desktop\angular2\node_modules\angular2\src\core\render\api.d.ts
    Error:(13, 13) TS2304: Cannot find name 'Map'.
    Error:(14, 84) TS2304: Cannot find name 'Map'.
    C:\Users\armyTik\Desktop\angular2\node_modules\angular2\src\facade\async.d.ts
    Error:(27, 33) TS2304: Cannot find name 'Promise'.
    Error:(28, 45) TS2304: Cannot find name 'Promise'.
    C:\Users\armyTik\Desktop\angular2\node_modules\angular2\src\facade\collection.d.ts
    Error:(1, 25) TS2304: Cannot find name 'MapConstructor'.
    Error:(2, 25) TS2304: Cannot find name 'SetConstructor'.
    Error:(4, 27) TS2304: Cannot find name 'Map'.
    Error:(4, 39) TS2304: Cannot find name 'Map'.
    Error:(7, 9) TS2304: Cannot find name 'Map'.
    Error:(8, 30) TS2304: Cannot find name 'Map'.
    Error:(11, 43) TS2304: Cannot find name 'Map'.
    Error:(12, 27) TS2304: Cannot find name 'Map'.
    Error:(14, 23) TS2304: Cannot find name 'Map'.
    Error:(15, 25) TS2304: Cannot find name 'Map'.
    Error:(95, 41) TS2304: Cannot find name 'Set'.
    Error:(96, 22) TS2304: Cannot find name 'Set'.
    Error:(97, 25) TS2304: Cannot find name 'Set'.
    C:\Users\armyTik\Desktop\angular2\node_modules\angular2\src\facade\lang.d.ts
    Error:(13, 17) TS2304: Cannot find name 'Map'.
    Error:(14, 17) TS2304: Cannot find name 'Set'.
    Error:(78, 59) TS2304: Cannot find name 'Map'.
    C:\Users\armyTik\Desktop\angular2\node_modules\angular2\src\facade\promise.d.ts
    Error:(2, 14) TS2304: Cannot find name 'Promise'.
    Error:(7, 32) TS2304: Cannot find name 'Promise'.
    Error:(8, 38) TS2304: Cannot find name 'Promise'.
    Error:(9, 35) TS2304: Cannot find name 'Promise'.
    Error:(9, 93) TS2304: Cannot find name 'Promise'.
    Error:(10, 34) TS2304: Cannot find name 'Promise'.
    Error:(11, 32) TS2304: Cannot find name 'Promise'.
    Error:(11, 149) TS2304: Cannot find name 'Promise'.
    Error:(12, 43) TS2304: Cannot find name 'Promise'.
    C:\Users\armyTik\Desktop\angular2\node_modules\angular2\src\http\headers.d.ts
    Error:(43, 59) TS2304: Cannot find name 'Map'.
    C:\Users\armyTik\Desktop\angular2\node_modules\angular2\src\http\url_search_params.d.ts
    Error:(11, 16) TS2304: Cannot find name 'Map'.
    C:\Users\armyTik\Desktop\angular2\node_modules\angular2\src\platform\browser\browser_adapter.d.ts
    Error:(75, 33) TS2304: Cannot find name 'Map'.
    C:\Users\armyTik\Desktop\angular2\node_modules\angular2\src\platform\dom\dom_adapter.d.ts
    Error:(85, 42) TS2304: Cannot find name 'Map'.
    C:\Users\armyTik\Desktop\angular2\node_modules\rxjs\CoreOperators.d.ts
    Error:(35, 67) TS2304: Cannot find name 'Promise'.
    Error:(50, 66) TS2304: Cannot find name 'Promise'.
    Error:(89, 67) TS2304: Cannot find name 'Promise'.
    Error:(94, 38) TS2304: Cannot find name 'Promise'.
    Error:(94, 50) TS2304: Cannot find name 'Promise'.
    C:\Users\armyTik\Desktop\angular2\node_modules\rxjs\Observable.d.ts
    Error:(46, 62) TS2304: Cannot find name 'Promise'.
    Error:(47, 42) TS2304: Cannot find name 'Iterator'.
    Error:(103, 74) TS2304: Cannot find name 'Promise'.
    Error:(103, 84) TS2304: Cannot find name 'Promise'.
    Error:(143, 66) TS2304: Cannot find name 'Promise'.
    Error:(158, 65) TS2304: Cannot find name 'Promise'.
    Error:(201, 66) TS2304: Cannot find name 'Promise'.
    Error:(206, 38) TS2304: Cannot find name 'Promise'.
    Error:(206, 50) TS2304: Cannot find name 'Promise'.
    C:\Users\armyTik\Desktop\angular2\node_modules\rxjs\observable\ForkJoinObservable.d.ts
    Error:(6, 50) TS2304: Cannot find name 'Promise'.
    Error:(7, 58) TS2304: Cannot find name 'Promise'.
    C:\Users\armyTik\Desktop\angular2\node_modules\rxjs\observable\FromObservable.d.ts
    Error:(7, 38) TS2304: Cannot find name 'Promise'.
    Error:(7, 51) TS2304: Cannot find name 'Iterator'.
    C:\Users\armyTik\Desktop\angular2\node_modules\rxjs\observable\PromiseObservable.d.ts
    Error:(9, 31) TS2304: Cannot find name 'Promise'.
    Error:(10, 26) TS2304: Cannot find name 'Promise'.
168
Stav Alfi

TypeScript ^ 2.0.0ではAngular 5

これは以前のバージョンのAngular 2+でも同じように機能するはずです。

TypeScript 2.0.0でこれを機能させるために、私は次のようにしました。

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

tsconfig.json

 "compilerOptions": {
    "declaration": false,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "mapRoot": "./",
    "module": "es6",
    "moduleResolution": "node",
    "noEmitOnError": true,
    "noImplicitAny": false,
    "outDir": "../dist/out-tsc",
    "sourceMap": true,
    "target": "es5",
    "typeRoots": [
      "../node_modules/@types"
    ],
    "types": [
      "core-js"
    ]
  }

TypeScript 2.0.0における@typesの詳細

  1. https://blogs.msdn.Microsoft.com/TypeScript/2016/06/15/the-future-of-declaration-files/ /
  2. https://www.npmjs.com/~types

インストール例:

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

重複識別子エラー

これは最も可能性が高いです。重複したecmascript 6タイピングがすでに他のどこかからインポートされている可能性が最も高いためです。おそらく古いes6シムです。

typings.d.tsを再確認して、es6への参照がないことを確認してください。タイピングディレクトリがある場合は、es6への参照をすべて削除します。

例えば:

これはtypings.jsonのtypes:['core-js']と競合します。

{
  "globalDependencies": {
    "core-js": "registry:dt/core-js#0.0.0+20160602141332" 
    // es6-shim will also conflict
  }
}

core-jsのtypes配列にtsconfig.jsonを含めるのは、インポート元の唯一の場所です。

Angular CLI 1.0.0-beta.30

Angular-CLIを使用している場合は、typings.json内のlib配列を削除します。これは、core-jsを型で宣言することと矛盾するようです。

"compilerOptions" : {
  ...
  // removed "lib": ["es6", dom"],
  ...
},
"types" : ["core-js"]

Angular CLIを使用しているWebstorm/Intellijユーザー

組み込みのTypeScriptコンパイラが無効になっていることを確認してください。これはCLIと競合します。 TypeScriptをCLIでコンパイルするには、ng serve設定を設定します。

enter image description here

Tsconfig compilerOptions lib vs types

コアjs型定義をインストールしたくない場合は、TypeScriptに含まれるes6ライブラリがいくつかあります。それらはtsconfigのlib: []プロパティを通して使われます。

たとえば、こちらを参照してください。 https://www.typescriptlang.org/docs/handbook/compiler-options.html

注--libが指定されていない場合は、デフォルトのライブラリが挿入されます。インジェクトされたデフォルトライブラリは次のとおりです。►--target ES5の場合:DOM、ES5、ScriptHost►--target ES6の場合:DOM、ES6、DOM.Iterable、ScriptHost

tl; dr

簡単な回答"lib": [ "es6", "dom" ]または"types": ["core-js"]のいずれかを使用してcan't find Promise,Map, Set and Iteratorを解決できます。ただし両方を使用すると、識別子の重複エラーが発生します。

173
Kris Hollenbeck

コードがPromiseオブジェクトを作成しようとしているときにも同じ問題(「Promiseが見つかりません」)があります。

System.jsを形成するためにSystem.config({...})を取り出してindex.htmlに含めるという方法を含む、stackoverflowで見つかった解決策を試してみました。

最後に私は問題を解決しました。問題は、index.htmlにes6-shim.min.jsが含まれていることです。ただし、tsconfig.jsonでは、 "compilerOptions"の下の "target"プロパティは "es5"の値を持ちます。 「es6」に変更した後、エラーがなくなりました。

75
Daniel C. Deng

アングル2決勝

- es5のサポート (TS 2.0.0以降で完全に動作します)

es6-shimes6-shimを一緒にインストールしている場合、アップデートごとにcore-jsはサポートされません。 tsconfig.jsonを参照して、es6-shimの入力を削除します。 core-js内でのes5サポートについては、以下のmain.tsタイピングを参照できます。

///<reference path="./../typings/globals/core-js/index.d.ts"/>

tsconfig.json

exclude: [
   "node_modules", //<-- this would be needed in case of VS2015
   "node_modules/@typings",
   "typings"
]

- es6サポート

"target"プロパティをes6に設定するだけで、すべてエラーになります。そして、変換されたコードはes6フォーマットになります。

63
Pankaj Parkar

Angular-2.0.0-rc.4以降で更新

TLDR;

  1. es6に変換

    • エラーは消えます(いくつかの問題あり)。
  2. es5に変換

    • タイピングをインストール
    • es6シムを取り付けます
    • それがあなたのコードと一致することを確認してください。
    • エラーは消えます。

読者のために:

オプション1:es6またはes2015に変換

tsconfig.json:

{
  "compilerOptions": {
    "target": "es6",
    "module": "system",
    "moduleResolution": "node",
     ...
  },
"exclude": [
    "node_modules",
    "jspm_packages"
  ]
}

覚えておいてください uglifyjsは現在es6をサポートしていません 。これはプロダクションバンドルの作成に影響を与える可能性があります。

オプション2:es5に変換し、タイピングをインストールしてからes6-shimをインストールします。

tsconfig.json:

{
  "compilerOptions": {
    "target": "es5",
    "module": "system",
    "moduleResolution": "node",
     ...
  },
  "exclude": [
    "node_modules",
    "jspm_packages"
  ]
}

タイピングをインストールしてからes6-shimをインストールします。

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

このルートに進む場合は、TypeScriptコンパイラが.d.tsファイルを見つけられることを確認する必要があります。

2つの選択肢があります。

a。 tsconfig.jsonがtypingsフォルダーと同じレベルにあることを確認してください。

b。 angular2アプリケーションがブートストラップされているmain.tsファイルに参照を含めます。

オプションA:tsconfig.jsonがtypingsフォルダーと同じレベルにあることを確認してください。

注:typingsフォルダーを除外するためにexcludeフラグを使用しないでください。

project
|-- src
|-- node_modules
|-- package.json
|-- typings
|-- tsconfig.json

オプションB:ブートストラップの前にメインファイルで参照する(しないでください)

他の回答に示すように、このファイルはAngularに含まれなくなりました

main.ts:

/// <reference path="../../typings/globals/es6-shim/index.d.ts" />
42
Nick Acosta

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)
    }
}
8
Niels Steenbeek

これは私のために働いたものです。

typings.jsonファイルが存在するか確認してください。

こんな感じです

{
  "globalDependencies": {
    "core-js": "registry:dt/core-js#0.0.0+20160317120654",
    "jasmine": "registry:dt/jasmine#2.2.0+20160505161446",
    "node": "registry:dt/node#6.0.0+20160613154055"
  }
}

タイピングパッケージをグローバルにインストールします。

Sudo npm install -g typings

typings をインストールした後、

typings install

その後、サーバーを再起動してください。

8

Promise.resolve() メソッドが認識されないという同様の問題がありました。 tsconfig.json でES5から ES6 "target" の値を変更しました。これで問題は解決しました。

お役に立てれば。

6

Angular 2はRC 0になったので、/angular2/typings/browser.d.tsはAngular 2の配布には含まれなくなりました。ファイルは個別にインストールできます。

ここから: https://github.com/angular/angular /issues/8513 いくつかのオプションがあります。私のために働いたのは次のとおりです。

typings install es6-shim --ambient --save

// In your app.ts
/// <reference path="typings/browser.d.ts" />
5
James

TSブートストラップファイルへのトリプルスラッシュ参照を追加することなく、この問題を解決することができました。ES6に変更すると、 @DatBoi と言われる)VS2015のNodeJSNPMがバンドルされるグローバルにtypingsを構築またはインストールします。

これが私がいくつかのステップでやったことです:

  • プロジェクトのpackage.jsonファイルにtypingsを追加しました。
  • 各NPMアクションの後にscriptを実行/更新するためにpackage.jsonファイルにtypingsブロックを追加しました。
  • プロジェクトのルートフォルダにtypings.jsonへの参照を含むcore-jsファイルを追加しました。これは、現時点でES5/ES6の問題を修正するための最良のshim/polyfillパッケージの1つです。

package.jsonファイルは次のようになります(関連する行のみ)。

{
  "version": "1.0.0",
  "name": "YourProject",
  "private": true,
  "dependencies": {
    ...
    "typings": "^1.3.2",
    ...
  },
  "devDependencies": {
    ...
  },
  "scripts": {
      "postinstall": "typings install"
  }
}

そしてこれがtypings.jsonファイルです。

{
  "globalDependencies": {
    "core-js": "registry:dt/core-js#0.0.0+20160602141332",
    "jasmine": "registry:dt/jasmine#2.2.0+20160621224255",
    "node": "registry:dt/node#6.0.0+20160621231320"
  }
}

JasmineNodeは必須ではありませんが、将来必要になる場合に備えてそれらを保持することをお勧めします)。

この修正はAngular2 RC1からRC4でうまく機能します。これは私が必要としているものですが、他のES6対応ライブラリパッケージでも同様の問題が修正されると思います。

私の知る限りでは、これはVS2015のデフォルト設定を台無しにすることなくそれを修正するための最もクリーンな方法です。

より多くの情報と問題の詳細な分析のために、私は 私のブログでこの記事を読む )にも勧めます。

3
Darkseal

Angular2 RC1をタイピングv1.0 +で使用する場合は、次のコマンドを使用してください。

typings install dt~core-js --save --global

core-js定義をインストールしてから、main.tsでグローバルインデックスを参照します。

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

Es6-shimまたは他のシムライブラリを使用している場合は、代わりにそのためのタイピングをインストールします

https://github.com/typings/typings/issues/517を参照してください

3
Simon Trewhella

Angular 5からAngular 6にアップグレードした後に、これらの問題が発生することに気付きました。VS2017で次の操作を行うことで、これを修正できました。

  • TypeScriptの特定のバージョン、2.9用にTypeScript SDKが(Visual Studioインストーラを介して)インストールされていることを確認します。
  • Module Systemプロジェクトのプロパティーが、私のtsconfig.json:ES2015のものと一致するように設定されていることを確認してください。 tsconfigファイルがプロジェクトのルートにある場合、これは通常自動的に同期されます。ただし、VS Angularテンプレートを使用していたため、これらのファイルは "ClientApp"サブフォルダーに配置され、Module Systemプロジェクトプロパティは設定されませんでした。

VS2017 Project Properties

tsconfig.json:

{
  "compileOnSave": false,
  "compilerOptions": {
    "outDir": "./dist/out-tsc",
    "sourceMap": true,
    "declaration": false,
    "moduleResolution": "node",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "target": "es5",
    "lib": [
      "es2017",
      "dom"
    ],
    "module": "es2015",
    "baseUrl": "./"
  }
}
2
dasch88

Visual Studio 2017でこれらのエラーが発生したためにここに来た場合は、コンパイルに成功すれば上記とは別の問題が発生します。これは、言語サービスがtsconfig.jsonを選択しないためです。

https://developercommunity.visualstudio.com/content/problem/208941/vs-156-ignores-tsconfigjson-and-typescriptcompileb.html

Tsconfig.jsonのBuild Actionを "Content"(右クリック - > Properties)に設定する必要があります。そうすれば、VSがそれを拾います。

1
Jopnert

別の良い解決策次の内容のプロジェクトのルートディレクトリにファイルtypings.jsonを作成する必要があります。

{
  "globalDependencies": {
    "core-js": "registry:dt/core-js#0.0.0+20160725163759",
    "jasmine": "registry:dt/jasmine#2.2.0+20160621224255",
    "node": "registry:dt/node#6.0.0+20160909174046"
  }
}

グローバルまたはローカルのタイピングパッケージがインストールされていない場合は、インストールします(グローバルにインストールします)。

Sudo npm install --global typings

プロジェクトのルートディレクトリで次のコマンドを実行します。

typings install

その後、問題は解決しました。 tsconfigターゲットをes6またはes7に変更する必要はありません。あなたのWebアプリケーションはそれ以降のブラウザのいくつかの古いバージョンをサポートしていません。

1

クラス内でpromiseオブジェクトを作成するときにも同じ問題がありました。 "es6"から "es5"にターゲット名を変更することで私の問題は解決しました。

1
CharithW

考えられる別の解決策は、タイピングを再インストールすることです。
これは私にとって"angular2": "2.0.0-beta.15"に有効です。

  1. npm clean cache
  2. npm install
  3. npm install -g typings
  4. プロジェクトからtypingsディレクトリを削除します(typingsモジュールがインストールされているディレクトリ)
  5. typings install
  6. npm run
1
Vicky Gonsalves

私はAngular 2チュートリアル(ヒーロー)でトレーニングしています。
これらの回答にコメントされている@ types/core-jsをインストールした後、 "Duplicate identifier"エラーが発生しました。
私の場合は、tsconfig.jsonのlib行を削除することで解決しました。

// "lib":["es2015"、 "dom"]

0
coffeenjava

Boot.ts内の参照が正しいパスではないことがわかりました。そのパスを/// <reference path=">../../../node_modules/angular2/typings/browser.d.ts" />に更新すると、Promiseエラーが解決されました。

0
dawesome