How can I fix compile time errors even using compiler options as target es6 and es2017 in Angular 7?

Question

When I am trying to compile my Angular 7 source then I am getting below compilation errors.

Can anyone guide me?

I tried to find these errors on Google and used some articles.

Please see my tsconfig.json

 {
  "compileOnSave": false,
  "compilerOptions": {
    "baseUrl": "./",
    "outDir": "./dist/out-tsc",
    "sourceMap": true,
    "declaration": false,
    "moduleResolution": "node",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "target": "es2017",
    "typeRoots": [
      "node_modules/@types"
    ],
    "lib": [      
      "es2017",
      "dom"
    ]
  }
}

I even added es6 but still the errors are same.

I updated following packages but still the errors are same.

 "@types/node": "^10.12.18",
 "ts-node": "^7.0.1",
 "tslint": "^5.12.0"

I am using Angular 7.1.4 and Material 7.2.0.

Errors are mentioned below:

Severity    Code    Description Project File    Line    Suppression State
Error   TS2583  (TS) Cannot find name 'Set'. Do you need to change your target library? Try changing the `lib` compiler option to es2015 or later.  ClientApp\node_modules\@angular\cdk\platform\typings\features\input-types.d.ts  9   Active
Error   TS2583  (TS) Cannot find name 'Set'. Do you need to change your target library? Try changing the `lib` compiler option to es2015 or later.  ClientApp\node_modules\@angular\common\src\directives\ng_class.d.ts 48  Active
Error   TS2583  (TS) Cannot find name 'Map'. Do you need to change your target library? Try changing the `lib` compiler option to es2015 or later.  ClientApp\node_modules\@angular\common\src\pipes\keyvalue_pipe.d.ts 47  Active
Error   TS2583  (TS) Cannot find name 'Map'. Do you need to change your target library? Try changing the `lib` compiler option to es2015 or later.  ClientApp\node_modules\@angular\common\src\pipes\keyvalue_pipe.d.ts 50  Active
Error   TS2583  (TS) Cannot find name 'Map'. Do you need to change your target library? Try changing the `lib` compiler option to es2015 or later.  ClientApp\node_modules\@angular\common\src\pipes\keyvalue_pipe.d.ts 51  Active
Error   TS2304  (TS) Cannot find name 'Iterable'.   ClientApp\node_modules\@angular\core\src\change_detection\differs\default_iterable_differ.d.ts  20  Active
Error   TS2583  (TS) Cannot find name 'Map'. Do you need to change your target library? Try changing the `lib` compiler option to es2015 or later.ClientApp\node_modules\@angular\core\src\change_detection\differs\default_keyvalue_differ.d.ts    31  Active
Error   TS2583  (TS) Cannot find name 'Map'. Do you need to change your target library? Try changing the `lib` compiler option to es2015 or later.  ClientApp\node_modules\@angular\core\src\change_detection\differs\default_keyvalue_differ.d.ts  39  Active
Error   TS2304  (TS) Cannot find name 'Iterable'.   ClientApp\node_modules\@angular\core\src\change_detection\differs\iterable_differs.d.ts 14  Active
Error   TS2583  (TS) Cannot find name 'Map'. Do you need to change your target library? Try changing the `lib` compiler option to es2015 or later.ClientApp\node_modules\@angular\core\src\change_detection\differs\keyvalue_differs.d.ts   22  Active
Error   TS2583  (TS) Cannot find name 'Map'. Do you need to change your target library? Try changing the `lib` compiler option to es2015 or later.  ClientApp\node_modules\@angular\core\src\di\reflective_provider.d.ts    93  Active
Error   TS2583  (TS) Cannot find name 'Map'. Do you need to change your target library? Try changing the `lib` compiler option to es2015 or later.ClientApp\node_modules\@angular\core\src\di\reflective_provider.d.ts  93  Active
Error   TS2583  (TS) Cannot find name 'Set'. Do you need to change your target library? Try changing the `lib` compiler option to es2015 or later.  ClientApp\node_modules\@angular\core\src\metadata\ng_module.d.ts    24  Active
Error   TS2583  (TS) Cannot find name 'Set'. Do you need to change your target library? Try changing the `lib` compiler option to es2015 or later.  ClientApp\node_modules\@angular\core\src\metadata\ng_module.d.ts    25  Active
Error   TS2583  (TS) Cannot find name 'Set'. Do you need to change your target library? Try changing the `lib` compiler option to es2015 or later.  ClientApp\node_modules\@angular\core\src\metadata\ng_module.d.ts    28  Active
Error   TS2583  (TS) Cannot find name 'Set'. Do you need to change your target library? Try changing the `lib` compiler option to es2015 or later.ClientApp\node_modules\@angular\core\src\metadata\ng_module.d.ts  29  Active
Error   TS2583  (TS) Cannot find name 'Map'. Do you need to change your target library? Try changing the `lib` compiler option to es2015 or later.  ClientApp\node_modules\@angular\core\src\render3\jit\compiler_facade_interface.d.ts 117 Active
Error   TS2583  (TS) Cannot find name 'Map'. Do you need to change your target library? Try changing the `lib` compiler option to es2015 or later.ClientApp\node_modules\@angular\core\src\render3\jit\compiler_facade_interface.d.ts   118 Active
Error   TS2583  (TS) Cannot find name 'Map'. Do you need to change your target library? Try changing the `lib` compiler option to es2015 or later.  ClientApp\node_modules\@angular\platform-browser\src\browser\browser_adapter.d.ts   86  Active
Error   TS2583  (TS) Cannot find name 'Map'. Do you need to change your target library? Try changing the `lib` compiler option to es2015 or later.  ClientApp\node_modules\@angular\platform-browser\src\dom\dom_adapter.d.ts   97  Active
Error   TS2583  (TS) Cannot find name 'Set'. Do you need to change your target library? Try changing the `lib` compiler option to es2015 or later.  ClientApp\node_modules\@angular\platform-browser\src\dom\shared_styles_host.d.ts    11  Active
Error   TS2583  (TS) Cannot find name 'Set'. Do you need to change your target library? Try changing the `lib` compiler option to es2015 or later.  ClientApp\node_modules\@angular\platform-browser\src\dom\shared_styles_host.d.ts    22  Active
Error   TS2585  (TS) 'Promise' only refers to a type, but is being used as a value here. Do you need to change your target library? Try changing the `lib` compiler option to es2015 or later.  ClientApp\node_modules\rxjs\internal\Observable.d.ts    82  Active
Error   TS2304  (TS) Cannot find name 'Iterable'.   ClientApp\node_modules\rxjs\internal\types.d.ts 35  Active
Error   TS2585  (TS) 'Symbol' only refers to a type, but is being used as a value here. Do you need to change your target library? Try changing the `lib` compiler option to es2015 or later.   ClientApp\node_modules\rxjs\internal\types.d.ts 39  Active
Error   TS2583  (TS) Cannot find name 'Map'. Do you need to change your target library? Try changing the `lib` compiler option to es2015 or later.  ClientApp\src\app\models\DynamicFlatNode.ts 18  Active
Error   TS2583  (TS) Cannot find name 'Map'. Do you need to change your target library? Try changing the `lib` compiler option to es2015 or later.ClientApp\src\app\models\DynamicFlatNode.ts   33  Active
Error   TS1219  (TS) Experimental support for decorators is a feature that is subject to change in a future release. Set the 'experimentalDecorators' option to remove this warning.    ClientApp\src\app\models\DynamicFlatNode.ts 56  Active
Error   TS1219  (TS) Experimental support for decorators is a feature that is subject to change in a future release. Set the 'experimentalDecorators' option to remove this warning.    ClientApp\src\app\models\TodoItemNode.ts    51  Active
Error   TS1219  (TS) Experimental support for decorators is a feature that is subject to change in a future release. Set the 'experimentalDecorators' option to remove this warning.    ClientApp\src\app\models\TodoItemNode.ts    114 Active
Error   TS2583  (TS) Cannot find name 'Map'. Do you need to change your target library? Try changing the `lib` compiler option to es2015 or later.  ClientApp\src\app\models\TodoItemNode.ts    116 Active
Error   TS2583  (TS) Cannot find name 'Map'. Do you need to change your target library? Try changing the `lib` compiler option to es2015 or later.ClientApp\src\app\models\TodoItemNode.ts  119 Active

Answer 1

Instead of changing the target, you could also change the type definitions that are loaded during compilation and leave the target remaining as-is. This allows you to polyfill the new functionality that you need, while still transcompiling to the old target.

Example:

"compilerOptions": {
  "target": "es2015",
  "module": "esnext",
  "lib": ["dom", "es2018"], <-- additional types loaded here

This makes TypeScript aware that you use ES2018 features (like promise.finally) and it will eliminate an error message like: Try changing the 'lib' compiler option to 'es2018' or later.

The cool thing about this setting is that you can load these type definitions on a very granular/individual level, for example:

"lib": ["ES2015.Iterable", "ES2015.Promise", ...]

You need to ensure though that this functionality is either polyfilled or really existent in the execution environment.

Check out the documentation to learn more about the supported type definitions: https://www.typescriptlang.org/tsconfig#lib.

Note: Since TypeScript 4.5, there's even the possibility to load your own types from your node_modules instead of relying on the ones shipped with TypeScript: Supporting lib from node_modules

Answer 2

I found the following to resolve the issue

npm install -D @types/node

Answer 3

Search tsconfig.json file in your source code and try to set values of all target property as es2017 or es6.