Table of Contents

About

A transpiler permits to take an language source and to transform it in a language target.

The language source and target may be the same but with two differents version.

Transpiling = transforming + compiling

Usage

Browser with functions not yet implemented

A transpiler permits to take an expression that is not yet implemented in the target environment (browsers, node) and to generate code that mimic the same behavior.

It's used under the hood by a bundler in the transformation phase.

Most of the transpiler used the browserslist syntax to define the browser that should be supported

From one language to an other

  • Java to JavaScript: Example: J2CL

Example

Node

Node does not yet support ES module. If your code has an import statement (es module), the transpiler will transform it with a require instead

Browser API

All webapi feature are not fully supported by all browser. If your code uses a function that is not yet support, a transpiler could modify it or use a polyfill.

Browser CSS prefix (auto-prefixer)

To automatically add the prefixes

  • Gulp: gulp-autoprefixer
  • Grunt: grunt-autoprefixer

List