Angular: Can't find Promise, Map, Set and Iterator
Angular 5 with Typescript ^2.0.0
This should also work the same with earlier versions of Angular 2+.
To get this to work with typescript 2.0.0, I did the following.
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"
]
}
More about @types with typescript 2.0.0.
- https://blogs.msdn.microsoft.com/typescript/2016/06/15/the-future-of-declaration-files/
- https://www.npmjs.com/~types
Install Example:
npm install --save-dev @types/core-js
Duplicate Identifier errors
This is most likely because duplicate ecmascript 6 typings are already being imported from somewhere else most likely an old es6-shim.
Double check typings.d.ts
make sure there are no references to es6
. Remove any reference to es6
from your typings directory if you have one.
For Example:
This will conflict with types:['core-js']
in typings.json.
{
"globalDependencies": {
"core-js": "registry:dt/core-js#0.0.0+20160602141332"
// es6-shim will also conflict
}
}
Including core-js
in the types array in tsconfig.json
should be the only place it is imported from.
Angular CLI 1.0.0-beta.30
If you are using the Angular-CLI, remove the lib array in typings.json
. This seems to conflict with declaring core-js in types.
"compilerOptions" : {
...
// removed "lib": ["es6", dom"],
...
},
"types" : ["core-js"]
Webstorm/Intellij Users using the Angular CLI
Make sure the built in typescript compiler is disabled. This will conflict with the CLI. To compile your typescript with the CLI you can setup a ng serve
configuration.
Tsconfig compilerOptions lib vs types
If you prefer not to install core js type definitions there are some es6 libraries that come included with typescript. Those are used via the lib: []
property in tsconfig.
See here for example: https://www.typescriptlang.org/docs/handbook/compiler-options.html
Note: If --lib is not specified a default library is injected. The default library injected is: ► For --target ES5: DOM,ES5,ScriptHost ► For --target ES6: DOM,ES6,DOM.Iterable,ScriptHost
tl;dr
Short answer either "lib": [ "es6", "dom" ]
or "types": ["core-js"]
can be used to resolve can't find Promise,Map, Set and Iterator
. Using both however will cause duplicate identifier errors.
I also have the same problem--"Promise not found"--when the code wants to create a Promise object.
Tried some solution found on stackoverflow, including the one to take out System.config({ ... }) to form system.js and have it included in index.html.
Finally I solved the problem. The issue is that, in index.html, es6-shim.min.js is included. However, in tsconfig.json, the "target" property under "compilerOptions" has the value of "es5". After I changed it to "es6", error is gone.
Angular 2 Final
- es5 support (Works perfectly with TS 2.0.0 +)
Per update es6-shim
isn't supported now, if you have both typings installed together es6-shim
& core-js
together. Remove es6-shim
typing by mentioning in tsconfig.json. You could now refer below core-js
typing for es5
support inside 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 suppport
You just need to set "target"
property to es6
, then all will error go away. And the transpiled code will be in es6
format.