News for hackers. Stuff that matters.
Re:Announcing TypeScript 2.1 by euroclydon on Wednesday December 07, 2016 @01:12PM (#13124692)
One thing I never understood with Babel is which features are shimmed in the output JS and which features are re-implemented?

What I means is: I didn't know how to tell Babel which browsers I was targeting, and I'm pretty sure that some of their feature implementations do not feature test the platform before activating, since they were so compiled in. Is that the case?

Also, do you have to tell TypeScript your target runtime for it to it to use it's ES3 async/await logic vs. it's ES2015 (which uses generators), or does it automatically figure it out?

Re:Announcing TypeScript 2.1 by hzoo on Wednesday December 07, 2016 @01:40PM (#13124972)
You might be interested in https://github.com/babel/babel-preset-env :D.

(I'm working on it so let me know if you have questions)

Re:Announcing TypeScript 2.1 by pimterry on Wednesday December 07, 2016 @02:10PM (#13125240)
You do tell TypeScript which runtime you're targeting, and that's how it decides how to compile it. You either set `target` in your tsconfig.json, or you provide `--target` on the command line.

Docs: https://www.typescriptlang.org/docs/handbook/compiler-option...

Re:Announcing TypeScript 2.1 by mhink on Wednesday December 07, 2016 @02:30PM (#13125424)
They're getting better at describing which features are shimmed, but the easiest way to check is by running a single plugin on a bit of code and seeing for yourself.

For instance, I decided just now to check if `transform-object-rest-spread` included an Object.assign polyfill (because spread syntax transpiles to Object.assign behind the scenes.)

With the following input:

  var foo = { x: 1, y: 2 };
  var bar = { a: 3, b: 4, ...foo };
  var baz = new Promise(function(resolve, reject) {
    resolve("quux");
  });
I get the following output

  var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
  var foo = { x: 1, y: 2 };
  var bar = _extends({ a: 10, b: 11 }, foo);
  var baz = new Promise(function(resolve, reject) {
    resolve("quux");
  });
The problem here, (to borrow phrasing from the docs) is that "Babel uses very small helpers for common functions such as _extend. By default this will be added to every file that requires it. This duplication is sometimes unnecessary, especially when your application is spread out over multiple files."

To solve this problem, many people use the `transform-runtime` plugin [1] as well. To put it shortly, it replaces inline helper functions (like _extends in the example above) with imports from an adapter module called 'babel-runtime', which itself exposes the relevant polyfills (regenerator[2] and core-js[3]).

With `transform-runtime`, I get the following:

  import _Promise from "babel-runtime/core-js/promise";
  import _extends from "babel-runtime/helpers/extends";
  var foo = { x: 1, y: 2 };
  var bar = _extends({ a: 10, b: 11 }, foo);

  var baz = new _Promise(function (resolve, reject) {
    resolve("foo");
  });
Notice that the Promise implementation was polyfilled as well.

> I didn't know how to tell Babel which browsers I was targeting...

You might *really like babel-preset-env[4], a new project they just launched. Basically, you give it a set of browser targets (much like autoprefixer) and it works out exactly which plugins you need to support the latest (currently es2015, I think) version of javascript.

Hope that helps! Sorry for going on a Babel-related spiel in a Typescript thread, couldn't help myself. ;)

1: http://babeljs.io/docs/plugins/transform-runtime/#technical-... 2: https://facebook.github.io/regenerator/ 3: https://github.com/zloirock/core-js 4: https://github.com/babel/babel-preset-env

Re:Announcing TypeScript 2.1 by frankwallis on Wednesday December 07, 2016 @03:32PM (#13125951)
Deduplication of helper methods is now available in typescript too, using the 'importHelpers' compiler option. It will automatically add import statements to include the helpers from the 'tslib' package, see https://github.com/Microsoft/tslib
Re:Announcing TypeScript 2.1 by WorldMaker on Wednesday December 07, 2016 @05:21PM (#13126801)
Thanks for the link, this was something I was specifically waiting for release but haven't seen come across in the release notes.
Re:Announcing TypeScript 2.1 by hzoo on Wednesday December 07, 2016 @06:31PM (#13127194)
There's actually a useBuiltins option to remove the _extends helper if you want to use that.

https://babeljs.io/docs/plugins/transform-object-rest-spread...

Might be cool in combination with preset-env