ES6 as the typescript target compiler option for angularjs or angular2

Question

The compiler option for my angularjs application is as below. Should I use any other package to transpile es6 to es5 again if I change the target to es6?

    {
      "compilerOptions": {
        "target": "es5", // Change this to es6
        "module": "commonjs",
        "sourceMap": true,
        "emitDecoratorMetadata": true,
        "experimentalDecorators": true,
        "removeComments": false,
        "noImplicitAny": false,
        "outDir": "./wwwroot/app/"
      },
      "exclude": [
        "node_modules",
        "wwwroot"
      ]
    }

Answer 1

Targeting ES5 is currently a baseline requirement

*According to The ES6 Compatibility Table:

• class isn't supported in

  • Chrome (latest)
  • Android (latest)

Note: This is just for the latest. Many of the ES6 features that would provide a measurable benefit have only been implemented in the latest browser versions. Ie backward-compatibility is virtually nonexistent.

There are likely other use cases that would be better described using ES6 that aren't fully supported by browser.

In short, you should target ES5 for the foreseeable future until browsers have a chance to catch up.

Answer 2

Which target you pick is dependent on which browsers you support. Looking at the The ES6 Compatibility Table, we can make general guidelines about what to target. As long as the platform support is greater than or equal to TypeScript support, then we can estimate what we want to target.

First examining differences in TypeScript versions in the compatibility table, we only find a few differences:

• TS 2.3 added 2017's trailing commas in function syntax, and 2018's object rest/spread properties and Asynchronous Iterators.
• TS 2.5 added 2019 miscellaneous' optional catch binding.
• TS 2.7 added Next Draft's numeric separators.

Now comparing TS's feature set to the platforms:

target: ES3 - if you want to support:

• IE8 - does not support ES5

target: ES5 - if you want to support:

• IE11 - does not support ES6
• (iOS) Safari 9 - does not support ES6
• Opera Mini - does not support ES6
• Android Browser - does not support ES6
• Node 4 - does not support ES6
• Potentially Firefox ESR or Edge 14. They implement some/most of ES6, but there may be a few features missing. Check if you need said features or can polyfill/shim them.

target: ES6 (ES2015) - if you use these features and you want to support:

• Safari 10.0 (iOS 10.2) and Node 6.5 - does not natively support exponentiation (**) operator.
• Safari 10.0 (iOS 10.2) - does not natively support nested rest destructuring.

target: ES7 (ES2016) - if you want to use these features and you want to support:

• Safari 10.0 (iOS 10.2), or Node 7.5 - does not natively support ES2017's async functions
• Safari 10.0 (iOS 10.2) - does not natively support Object.getOwnPropertyDescriptors, but there is a shim for that.
• Node <8 - does not natively support trailing commas in function syntax (Note neither does TS <2.3)
• Edge 17, Chrome 61, and Node <8.10 - supports only a subset of __define/lookupGetter/Setter__.

target: ES2017 - if you want to use these features and you want to support:

• Edge (current version 18), or Safari/iOS 11.0 - do not natively support ES2018's object rest/spread properties
• Edge 17, or Safari/iOS 11.0 - does not support ES2018's Promise.prototype.finally but it looks like there's a shim for that
• Edge (current version 18), or Safari 11.1 (iOS 11.3) - do not natively support ES2018's Asynchronous Iterators

I'll leave ES2018/ESNext as an exercise for the reader, or I may updated this in the future. It'd be a fair statement to say some modern browsers or libraries don't support some of their features as they can be experimental.

Hopefully this will give you an idea of what to target, but testing is essential to guarantee you support the platforms you want. There might be smaller features not in the compatibility table or something I missed, so be sure to test.

Answer 3

The answer from Evan Plaice was good but it is now old (almost 18 months as of writing this). The compability table has changed a lot and it might be ok to target ES6 (ES2015) now. Check the table for the browsers you need to support.