Transpilation
Transpilation translates a program or computational representation into an equivalent form compatible with a target language, version, or execution platform.
Web Components in Action
Transpilation is the source-to-source transformation of code from one readable programming language or language version into another.
- How it is used
- Makes newer component JavaScript usable in older browsers, particularly IE11.
- How deep it goes
- Defines source-to-source transformation and walks through Babel installation, configuration, and npm scripts; does not examine Babel’s transformation internals.
- Examples
- Uses npm scripts that transform bundled slider, coordinate-picker, and color-picker files into separate older-browser builds.
- What you can do after
- Apply it via Babel and npm scripts to produce older-browser JavaScript alongside Rollup-bundled component files.
Get Programming with JavaScript Next: New features of ECMAScript 2015, 2016, and beyond
The source-to-source transformation of code from one programming language or language version into another with similar semantics.
- How it is used
- Enables use of ESNext features while browsers catch up with JavaScript updates.
- How deep it goes
- Defines source-to-source compilation and walks through Babel 6 setup, configuration, and output without detailing transpiler internals.
- Examples
- Uses a let declaration, its strict-mode var output, and a src-to-dist Babel command.
- What you can do after
- Operate/configure Babel 6 to transpile ES2015 source into a dist directory.
F# in Action: A Revised Edition of Get Programming with F#
Transpilation is source-to-source translation from one programming language into another, typically preserving a comparable level of abstraction.
- How it is used
- Uses source-to-source translation to let alternative languages run on the JavaScript web runtime.
- How deep it goes
- Demonstrates installation, compilation, generated output, library rewriting, and REPL execution, while deferring detailed JavaScript build tooling.
- Examples
- Uses an arithmetic F# script, emitted JavaScript, the Fable REPL, and a larger order domain as concrete artifacts.
- What you can do after
- Apply it via Fable to compile F# scripts into JavaScript and test the result interactively or locally.
Read how F# in Action: A Revised Edition of Get Programming with F# explains transpilation →
React Quickly, Second Edition
A transpiler is a program that converts source code from one programming language or syntax level into another, typically within the same broad programming domain.
- How it is used
- Uses transpilation to let React developers write JSX while browsers receive standard JavaScript.
- How deep it goes
- Defines syntax conversion, explains generated React.createElement calls, and stops short of detailed transformer internals.
- Examples
- Shows `<h1>Hello</h1>` becoming a React.createElement-based JavaScript expression.
- What you can do after
- Understand why JSX must be transformed before browsers can execute React applications.
Read how React Quickly, Second Edition explains transpilation →
Related concepts
- Babelused by · Babel is a JavaScript compiler and transformation tool that converts modern JavaScript syntax and related extensions into code compatible with specified environments.
- JSXuses · JSX is a JavaScript syntax extension for expressing user-interface elements with XML-like or HTML-like markup that is transformed into JavaScript.
- JavaScriptproduces · JavaScript is a high-level, dynamically typed, multi-paradigm programming language standardized as ECMAScript and used for web and general-purpose programming.
- deployment pipelineused by · A sequence of automated or manual stages that builds, tests or validates, packages, and delivers software or models toward deployment.
These guides are generated from the text of Manning books by Manning's knowledge graph and link to the sections they draw on. The full books are available on liveBook and at manning.com.