So, we know what transpilation is, let's dig a little deeper into what transpilers we have:

  • Babel

  • TypeScript Compiler

  • SWC

  • ESBuild

  • Surcrase

First two I already mentioned

Babel is a de facto standard created around 2014. It was built to translate new modern JavaScript syntax to older syntaxes supported by browsers. Eventually people started using it for other purposes such as automating code migrations, so-called codemods, or compiling away dynamic code to static code to save runtime. Many libraries like styled-components and of course react are likely to have babel plugins that improve something in one way or another, using a compilation step to get some nice DX or performance improvements. Since version 7 Babel also supports TypeScript which makes it even more powerful.

TypeScript Compiler(TSC) is widely-used as a transpiler from TypeScript to some particular version of Javascript. Nowadays TypeScript tends to be used as a type-checker only, because Babel effectively compiles TypeScript to JavaScript whilst applying multiple library plugins of all sorts. TypeScript Compiler is not pluggable so there's no way to implement custom-made plugins that will affect the compilation of the code.

There is project named ttypescript that provides this capability by applying custom-made pluggable transforms. It's an amazing option for those projects that are still using TSC as the main compiler without Babel. It will slowly die out because of Babel's popularity and wide support.

Start a new discussion. All notification go to the author.