[TypeScript] Using ES6 and ESNext with TypeScript

TypeScript is very particular about what is and isn’t allowed in a TS file to protect you from common developer errors. By default if you set the compile target to ES5 it only allows you to use globally defined variables that were available in the ES5 time-frame. That said it is super easy to configure TypeScript to use ES6 or ESNext using the liboption.

We also cover how to make sure that these features work across the widest range of browsers using a simple polyfill.

Sometime, you use “Promise”, typescript reports error that Cannot find defination for Promise.

To solve this problem, you can change in tsconfig.json:

{
  "compilerOptions": {
    "target": "es5",
    "outDir": "lib",
    "lib": [
      "dom",
      "es2017"
    ]
  },
  "include": [
    "src"
  ]
}

Add a “lib” tag, and add “es2017” or “es6” into the array. This can help to solve the “Promise” (or any features not existing in es5).

Second way to do it is polyfill.

Install:

npm i -D core-js

In your code, just import ‘shim’ from ‘core-js’:

import "core-js/shim";
const foo = () => Promise.resolve(null);