Errors after updating tsconfig.json and package.json

Question

For some context, I just began running through the Ahead-of-time compilation cookbook found here, though I don't believe my errors are directly related to it: https://angular.io/guide/aot-compiler

I am using Visual Studio 2015 and updated my Angular 2 project to the newly released 2.4 and everything built just fine. I then, however, changed my tsconfig.json file to add "lib": [ "es2015", "dom" ] to my compilerOptions. The file now looks like this:

{
  "compilerOptions": {
    "target": "es5",
    "module": "commonjs",
    "moduleResolution": "node",
    "sourceMap": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "lib": [ "es2015", "dom" ],
    "removeComments": false,
    "noImplicitAny": true,
    "outDir": "dist",
    "suppressImplicitAnyIndexErrors": true
  },
  "compileOnSave": true
}

After this change, I re-built and got the following build error:

Build: duplicate identifier 'PropertyKey'.

I did some research and decided to remove "@types/core-js": "^0.9.34" from my package.json file, which seems to have resolved that error, but I now have several instances of the following new errors:

Build: Cannot find name 'Set'

Build: Cannot find name 'Promise'

Build: Cannot find name 'Map'

Here is my full package.json file:

{
  "name": "angular2-quickstart",
  "version": "1.0.0",
  "scripts": {
    "start": "tsc && concurrently \"tsc -w\" \"lite-server\" ",
    "docker-build": "docker build -t ng2-quickstart .",
    "docker": "npm run docker-build && docker run -it --rm -p 3000:3000 -p 3001:3001 ng2-quickstart",
    "pree2e": "npm run webdriver:update",
    "e2e": "tsc && concurrently \"http-server -s\" \"protractor protractor.config.js\" --kill-others --success first",
    "lint": "tslint ./app/**/*.ts -t verbose",
    "lite": "lite-server",
    "postinstall": "typings install",
    "test": "tsc && concurrently \"tsc -w\" \"karma start karma.conf.js\"",
    "test-once": "tsc && karma start karma.conf.js --single-run",
    "tsc": "tsc",
    "tsc:w": "tsc -w",
    "typings": "typings",
    "webdriver:update": "webdriver-manager update"
  },
  "license": "MIT",
  "dependencies": {
    "@angular/common": "~2.4.0",
    "@angular/compiler": "~2.4.0",
    "@angular/compiler-cli": "^2.4.1",
    "@angular/core": "~2.4.0",
    "@angular/forms": "~2.4.0",
    "@angular/http": "~2.4.0",
    "@angular/platform-browser": "~2.4.0",
    "@angular/platform-browser-dynamic": "~2.4.0",
    "@angular/platform-server": "^2.4.1",
    "@angular/router": "~3.4.0",
    "@angular/upgrade": "~2.4.0",
    "angular-in-memory-web-api": "~0.1.16",
    "bootstrap": "^3.3.7",
    "core-js": "^2.4.1",
    "reflect-metadata": "^0.1.8",
    "rxjs": "5.0.1",
    "systemjs": "0.19.39",
    "zone.js": "^0.7.4"
  },
  "devDependencies": {
    "@types/node": "^6.0.45",
    "concurrently": "^3.0.0",
    "lite-server": "^2.2.2",
    "typescript": "^2.0.3"
  },
  "repository": {}
}

To keep updated on new releases, I've pretty much been copying the dependencies portion of the example package.json file here: https://angular.io/guide/quickstart

That link is for the JavaScript version because that is the only one I can find, but I'm actually using TypeScript 2.1.4. Because of that, I probably have some parts of this file that are out of date. I'm just not sure how to determine specifically which parts.

I am not familiar with Visual Studio setup (intellij user). But maybe try using. `"lib": [ "es6", "dom" ],` Or possibly remove `"lib": [ "es20125", "dom" ],` completely and try using core-js @types. Look at my answer here on how to use core-js. http://stackoverflow.com/questions/35660498/angular-2-cant-find-promise-map-set-and-iterator/38876022#38876022 — khollenbeck, Jan 04 '17 at 20:18
Well that is what es6 or core-js does. They are pollyfills for the incompatibilities. So you can use es6 syntax in your code. — khollenbeck, Jan 04 '17 at 21:13
take this for example.. https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/assign. Notice at the bottom of the documentation there is a pollyfill example. core-js and es6 are the pollyfills. — khollenbeck, Jan 04 '17 at 21:16
Couple more references. https://www.typescriptlang.org/docs/handbook/compiler-options.html https://www.npmjs.com/package/core-js — khollenbeck, Jan 04 '17 at 21:17

score 0 · Answer 1 · edited May 23 '17 at 10:31

I am not familiar with Visual Studio setup (intellij user). But maybe try using. "lib": [ "es6", "dom" ], Or possibly remove "lib": [ "es20125", "dom" ], completely and try using core-js @types. Look at my answer here on how to use core-js.

Related Answer:

Angular 2 can't find Promise,Map,Set and Iterator

Cannot find name 'Promise' This error leads me to believe you are missing the type definitions for ES6.

Promise, Map, and Set are es6 specification.

You should be using an ES6 pollyfill library.

Errors after updating tsconfig.json and package.json

1 Answers1