Skip to main content
Version: 27.0

Babel7 or TypeScript

In Sept. 2018 Babel7 got released with an interesting preset: @babel/preset-typescript.

The goal is to make it easy for users using Babel to try TypeScript without moving out from Babel, just by adding a preset in their Babel config (here is the MSDN blog post about TypeScript and Babel 7).

Limitations​

While @babel/preset-typescript is a great preset, you must know the limitation of it. Here is what is possible with TypeScript (and ts-jest), which is not with Babel7 and @babel/preset-typescript:

No type-checking​

This is the big PRO of using TypeScript vs Babel, you have type-checking out of the box.

You'll get a more fluent TDD experience (when using ts-jest) since files will be type-checked at the same time they're compiled and ran.

Here TypeScript will throw while Babel won't:

const str: string = 42

With Babel, files are transpiled as isolated modules, there is no notion of "project". With TypeScript, files are part of a project and are compiled in that scope.

No namespace​

namespace app {
  export const VERSION = '1.0.0'
  export class App {
    /* ... */
  }
}

No const enum​

const enum Directions {
  Up,
  Down,
  Left,
  Right,
}

No declaration merging (enum, namespace, ...)​

You won't be able to do declaration merging.

No legacy import/export​

import lib = require('lib')
// ...
export = myVar

No caret type-casting with JSX enabled​

const val = <string>input