or run

npx @tessl/cli init
Log in

Version

Tile

Overview

Evals

Files

docs

cli.mdindex.mdintegrations.mdregister.mdtransformation.md
tile.json

tessl/npm-sucrase

Super-fast alternative to Babel for when you can target modern JS runtimes

Workspace
tessl
Visibility
Public
Created
Last updated
Describes
npmpkg:npm/sucrase@3.35.x

To install, run

npx @tessl/cli install tessl/npm-sucrase@3.35.0

index.mddocs/

Sucrase

Sucrase is a super-fast alternative to Babel that focuses on compiling non-standard language extensions (JSX, TypeScript, Flow) for modern JavaScript environments. Unlike Babel's comprehensive approach, Sucrase targets recent browsers and Node.js versions, achieving approximately 20x faster compilation speeds through a focused architecture that handles only essential transforms.

Package Information

  • Package Name: sucrase
  • Package Type: npm
  • Language: TypeScript
  • Installation: npm install sucrase

Core Imports

import { transform, getVersion, getFormattedTokens } from "sucrase";
import type { Options, Transform, TransformResult } from "sucrase";

For CommonJS:

const { transform, getVersion, getFormattedTokens } = require("sucrase");

Basic Usage

import { transform } from "sucrase";

// Transform TypeScript code to JavaScript
const result = transform(
  `const greeting: string = "Hello TypeScript!";`,
  {
    transforms: ["typescript"],
    filePath: "example.ts"
  }
);

console.log(result.code); // "const greeting = "Hello TypeScript!";"

// Transform JSX with TypeScript
const jsxResult = transform(
  `const element: JSX.Element = <div>Hello React!</div>;`,
  {
    transforms: ["typescript", "jsx"],
    filePath: "example.tsx"
  }
);

// Transform with source maps
const withSourceMap = transform(sourceCode, {
  transforms: ["typescript", "jsx"],
  sourceMapOptions: { compiledFilename: "output.js" },
  filePath: "input.tsx"
});

Architecture

Sucrase is built around several key components:

  • Core Transform Engine: Fast, focused parser and transformer for modern JS environments
  • Transform Pipeline: Configurable transforms for JSX, TypeScript, Flow, imports, and more
  • Registration System: Require hooks for automatic file transformation during development
  • Integration Ecosystem: Plugins for Jest, Webpack, Gulp, and ts-node
  • CLI Tools: Command-line utilities for batch transformation and development workflows

The library uses a forked and trimmed-down version of Babel's parser, optimized for speed over extensibility.

Capabilities

Core Transformation

Primary transformation engine that converts source code using specified transforms. Supports all major syntax extensions with optional source map generation.

function transform(code: string, options: Options): TransformResult;

interface TransformResult {
  code: string;
  sourceMap?: RawSourceMap;
}

function getVersion(): string;
function getFormattedTokens(code: string, options: Options): string;

Transformation

Registration and Hooks

Automatic file transformation system using Node.js require hooks. Enables transparent compilation during development without build steps.

function addHook(
  extension: string,
  sucraseOptions: Options,
  hookOptions?: HookOptions
): RevertFunction;

function registerAll(hookOptions?: HookOptions): RevertFunction;
function registerJS(hookOptions?: HookOptions): RevertFunction;
function registerJSX(hookOptions?: HookOptions): RevertFunction;
function registerTS(hookOptions?: HookOptions): RevertFunction;
function registerTSX(hookOptions?: HookOptions): RevertFunction;

Registration and Hooks

Command Line Interface

CLI tools for batch file transformation, project compilation, and development workflows. Includes both main CLI and Node.js wrapper.

sucrase -t typescript,jsx -d dist src
sucrase-node script.ts

CLI and Tools

Build Tool Integrations

Ready-to-use plugins for popular build tools and test frameworks. Seamlessly integrates Sucrase into existing development workflows.

// Jest transformer
function process(
  src: string,
  filename: string,
  options: TransformOptions<Partial<Options>>
): { code: string; map?: RawSourceMap | string | null };

// Webpack loader  
function loader(code: string): string;

// ts-node plugin
function create(createOptions): { transpile };

Build Tool Integrations

Common Transform Configurations

TypeScript Only

{ transforms: ["typescript"] }

React with TypeScript

{ transforms: ["typescript", "jsx"] }

Legacy CommonJS Modules

{ transforms: ["typescript", "jsx", "imports"] }

Flow with JSX

{ transforms: ["flow", "jsx"] }

Jest Testing

{ transforms: ["typescript", "jsx", "jest"] }