or run

npx @tessl/cli init
Log in

Version

Tile

Overview

Evals

Files

docs

ast-types.mdbrowser.mdcli.mdindex.mdmodules.mdregistration.mdtransformation.mdtransformers.md
tile.json

index.mddocs/

6to5

6to5 is a JavaScript transpiler that converts ES6+ (ECMAScript 2015+) code into backward-compatible ES5 code that can run in older browsers and environments. It provides comprehensive transformation of modern JavaScript features including classes, modules, arrow functions, template literals, destructuring, let/const declarations, and other ES6+ syntax into equivalent ES5 code.

Package Information

  • Package Name: 6to5
  • Package Type: npm
  • Language: JavaScript
  • Installation: npm install 6to5

Overview

6to5 is a JavaScript transpiler that converts ES6+ (ECMAScript 2015+) code into backward-compatible ES5 code. It enables developers to use modern JavaScript features while maintaining compatibility with older browsers and environments that do not support ES6+ syntax.

Key Features

  • Complete ES6+ to ES5 transformation: Converts classes, arrow functions, template literals, destructuring, modules, and other modern JavaScript features
  • Modular transformer system: 48+ individual transformers that can be enabled/disabled independently for fine-grained control
  • Multiple module output formats: Support for CommonJS, AMD, UMD, and SystemJS module systems
  • Comprehensive AST manipulation utilities: Full type system and builder functions for working with JavaScript Abstract Syntax Trees
  • Dual environment support: APIs for both Node.js server-side and browser client-side usage
  • Source map generation: Maintains debugging information through the transformation process
  • CLI tools for build workflows: Command-line interface for integration into development and build processes

Core Imports

// Main API (Node.js)
const to5 = require("6to5");

// Or using require hook
require("6to5/register");

// Browser API
<script src="node_modules/6to5/lib/6to5/api/browser.js"></script>

Basic Usage

const to5 = require("6to5");

// Transform ES6+ code to ES5
const result = to5.transform(`
class Person {
  constructor(name) {
    this.name = name;
  }
  
  greet() {
    return \`Hello, \${this.name}!\`;
  }
}
`, {
  modules: "common"
});

console.log(result.code);
// Output: ES5-compatible code

// Transform a file
const fileResult = to5.transformFileSync("input.js", {
  modules: "common",
  optional: ["es7.comprehensions"]
});

// Use require hook for automatic transformation
require("6to5/register")({
  optional: ["es7.comprehensions"]
});
// Now all required .js files will be transformed automatically

Architecture

6to5 is built around a modular transformation system:

  • Core Transform Engine: Parses ES6+ into AST, applies transformations, generates ES5 code
  • Transformer System: Modular plugins for different ES6+ features that can be enabled/disabled
  • Multiple API Surfaces: Node.js API, Browser API, and CLI tools
  • AST Type System: Comprehensive utilities for working with JavaScript ASTs
  • Module Formatters: Support for CommonJS, AMD, UMD, and SystemJS output formats

Core Transformation API

The primary transformation functionality for converting ES6+ code to ES5.

/**
 * Transform ES6+ code to ES5
 * @param code - Source code to transform
 * @param opts - Transformation options
 * @returns Object with code, map, and ast properties
 */
function transform(code: string, opts?: TransformOptions): TransformResult;

/**
 * Transform from existing AST
 * @param ast - Parsed AST
 * @param code - Original source code
 * @param opts - Transformation options
 * @returns Object with code, map, and ast properties
 */
function fromAst(ast: Node, code: string, opts?: TransformOptions): TransformResult;

/**
 * Transform file asynchronously
 * @param filename - Path to file
 * @param opts - Transformation options
 * @param callback - Callback with (err, result)
 */
function transformFile(filename: string, opts: TransformOptions, callback: (err: Error | null, result?: TransformResult) => void): void;
function transformFile(filename: string, callback: (err: Error | null, result?: TransformResult) => void): void;

/**
 * Transform file synchronously
 * @param filename - Path to file
 * @param opts - Transformation options
 * @returns Transform result
 */
function transformFileSync(filename: string, opts?: TransformOptions): TransformResult;

interface TransformResult {
  code: string;
  map?: Object;
  ast?: Node;
}

interface TransformOptions {
  filename?: string;
  filenameRelative?: string;
  modules?: "common" | "amd" | "umd" | "system" | "ignore";
  sourceMap?: boolean | "inline";
  sourceMapName?: string;
  sourceFileName?: string;
  sourceRoot?: string;
  moduleRoot?: string;
  whitelist?: string[];
  blacklist?: string[];
  optional?: string[];
  loose?: string[];
  experimental?: boolean;
  playground?: boolean;
  runtime?: boolean;
  comments?: boolean;
  compact?: boolean;
  code?: boolean;
  ast?: boolean;
  auxiliaryComment?: string;
  reactCompat?: boolean;
  moduleIds?: boolean;
  keepModuleIdExtensions?: boolean;
}

Core Transformation API Details

Registration and Runtime

Utilities for automatic compilation and runtime support.

/**
 * Register require hook for automatic transformation
 * @param opts - Registration options
 * @returns Registration function
 */
function register(opts?: RegisterOptions): Function;

/**
 * Load ES6+ polyfills
 */
function polyfill(): void;

/**
 * Generate 6to5 runtime helpers
 * @returns Runtime code as string
 */
function runtime(): string;

/**
 * Check if file can be compiled
 * @param filename - File path
 * @param altExts - Alternative extensions to check
 * @returns True if file can be compiled
 */
function canCompile(filename: string, altExts?: string[]): boolean;

/**
 * Default compilable file extensions
 */
canCompile.EXTENSIONS: string[]; // [".js", ".jsx", ".es6", ".es"]

interface RegisterOptions extends TransformOptions {
  extensions?: string[];
  cache?: boolean;
}

Registration and Runtime Details

AST Types and Utilities

Comprehensive system for working with JavaScript Abstract Syntax Trees.

const types: {
  // Type checking functions
  is(type: string, node: Node, opts?: Object, skipAliasCheck?: boolean): boolean;
  isIdentifier(node: Node, opts?: Object): boolean;
  isFunction(node: Node, opts?: Object): boolean;
  // ... many more is[Type] functions
  
  // AST builder functions  
  identifier(name: string): Identifier;
  functionExpression(id: Identifier | null, params: Pattern[], body: BlockStatement): FunctionExpression;
  // ... many more builder functions
  
  // Utility functions
  isReferenced(node: Node, parent: Node): boolean;
  isValidIdentifier(name: string): boolean;
  toIdentifier(name: string): string;
  getBindingIdentifiers(node: Node): Object;
  
  // Constants
  VISITOR_KEYS: Object;
  ALIAS_KEYS: Object;
  BUILDER_KEYS: Object;
};

AST Types and Utilities Details

Transformers

The modular transformation system with individual transformers for different ES6+ features.

const transformers: {
  // ES6 transformers
  "es6.arrowFunctions": Transformer;
  "es6.classes": Transformer;
  "es6.modules": Transformer;
  "es6.templateLiterals": Transformer;
  "es6.destructuring": Transformer;
  "es6.forOf": Transformer;
  "es6.spread": Transformer;
  "es6.parameters.default": Transformer;
  "es6.parameters.rest": Transformer;
  "es6.constants": Transformer;
  "es6.blockScoping": Transformer;
  
  // ES7 transformers
  "es7.comprehensions": Transformer;
  "es7.objectRestSpread": Transformer;
  "es7.exponentiationOperator": Transformer;
  
  // Other transformers
  "react": Transformer;
  "flow": Transformer;
  "regenerator": Transformer;
  "asyncToGenerator": Transformer;
};

const namespaces: {
  es3: string[];
  es5: string[];
  es6: string[];
  es7: string[];
  spec: string[];
  validation: string[];
  minification: string[];
  other: string[];
  playground: string[];
};

Transformers Details

Browser API

Browser-specific functionality for client-side usage.

/**
 * Execute transformed code immediately in browser
 * @param code - Source code to transform and run
 * @param opts - Transformation options
 * @returns Execution result
 */
function run(code: string, opts?: TransformOptions): any;

/**
 * Load and transform external script
 * @param url - Script URL
 * @param callback - Optional callback
 * @param opts - Transformation options
 * @param hold - Whether to hold execution
 */
function load(url: string, callback?: Function, opts?: TransformOptions, hold?: boolean): void;

Browser API Details

Command Line Interface

6to5 provides comprehensive CLI tools for build workflows.

# Basic transformation
6to5 script.js --out-file script-compiled.js

# Transform directory
6to5 src --out-dir lib

# Watch mode
6to5 src --out-dir lib --watch

# Source maps
6to5 script.js --out-file script.js --source-maps

# Module formats
6to5 script.js --out-file script.js --modules amd

# Runtime helpers
6to5 script.js --out-file script.js --runtime

# Enable specific transformers
6to5 script.js --out-file script.js --optional es7.comprehensions

# Loose mode
6to5 script.js --out-file script.js --loose es6.classes

CLI Tools Details

Module Formats

Support for different JavaScript module systems as output targets.

const moduleFormatters: {
  common: ModuleFormatter;      // CommonJS
  "common-strict": ModuleFormatter;
  amd: ModuleFormatter;         // AMD
  "amd-strict": ModuleFormatter;
  umd: ModuleFormatter;         // Universal Module Definition
  "umd-strict": ModuleFormatter;
  system: ModuleFormatter;      // SystemJS
  ignore: ModuleFormatter;      // No module transformation
};

Module Formats Details

Version and Metadata

/**
 * Package version string
 */
const version: string;