CtrlK
BlogDocsLog inGet started
Tessl Logo

tessl/npm-babel-generator

Turns an AST into code.

—

Pending
Overview
Eval results
Files

Babel Generator

Babel Generator converts Abstract Syntax Trees (ASTs) back into JavaScript code with comprehensive formatting options, source map generation, and support for all modern JavaScript features including ES2015+, Flow types, and JSX.

Package Information

  • Package Name: babel-generator
  • Package Type: npm
  • Language: JavaScript
  • Installation: npm install babel-generator

Core Imports

import generate from "babel-generator";
import { CodeGenerator } from "babel-generator";

For CommonJS:

const generate = require("babel-generator").default;
const { CodeGenerator } = require("babel-generator");

Basic Usage

import generate from "babel-generator";
import * as babylon from "babylon";

// Parse source code into AST
const ast = babylon.parse("const x = 1;");

// Generate code from AST
const output = generate(ast, {
  quotes: "double",
  compact: false
});

console.log(output.code); // "const x = 1;"
console.log(output.map);  // Source map object (if sourceMaps: true)

Architecture

Babel Generator is built around several key components:

  • Main Generator Function: Single function interface for converting ASTs to code
  • CodeGenerator Class: Class-based interface providing the same functionality
  • Printer Class: Core printing engine handling code generation and formatting
  • AST Node Generators: Specialized methods for each AST node type (expressions, statements, types, etc.)
  • Output Formatting: Comprehensive options for whitespace, quotes, minification, and source maps
  • Source Map Support: Optional source map generation with multi-file support

Capabilities

Code Generation

Main API for converting ASTs into JavaScript code with customizable formatting options.

function generate(
  ast: Object,
  opts?: GeneratorOptions,
  code?: string | Object
): GeneratorResult;

class CodeGenerator {
  constructor(ast: Object, opts?: GeneratorOptions, code?: string | Object);
  generate(): GeneratorResult;
}

interface GeneratorResult {
  code: string;
  map?: Object;
  rawMappings?: Array<{
    generated: { line: number; column: number };
    original: { line: number; column: number };
    source: string;
    name?: string;
  }>;
}

Code Generation

Formatting Options

Extensive configuration for output style including whitespace control, quote preferences, and minification.

interface GeneratorOptions {
  auxiliaryCommentBefore?: string;
  auxiliaryCommentAfter?: string;
  shouldPrintComment?: (comment: string) => boolean;
  retainLines?: boolean;
  retainFunctionParens?: boolean;
  comments?: boolean;
  compact?: boolean | "auto";
  minified?: boolean;
  concise?: boolean;
  quotes?: "single" | "double";
  filename?: string;
  flowCommaSeparator?: boolean;
  jsonCompatibleStrings?: boolean;
}

Formatting Options

Source Map Generation

Optional source map support for debugging and development tools integration.

interface SourceMapOptions {
  sourceMaps?: boolean;
  sourceMapTarget?: string;
  sourceRoot?: string;
  sourceFileName?: string;
}

Source Maps

AST Node Support

Comprehensive support for all JavaScript, Flow, and JSX AST node types with specialized generation methods.

// Core node types supported:
// - Base nodes (File, Program, BlockStatement, etc.)
// - Expression nodes (CallExpression, BinaryExpression, etc.)
// - Statement nodes (IfStatement, ForStatement, etc.)
// - Type & literal nodes (Identifier, StringLiteral, etc.)
// - Class nodes (ClassDeclaration, ClassMethod, etc.)
// - Method nodes (FunctionExpression, ArrowFunctionExpression, etc.)
// - Module nodes (ImportDeclaration, ExportDeclaration, etc.)
// - Flow type nodes (TypeAnnotation, InterfaceDeclaration, etc.)
// - JSX nodes (JSXElement, JSXAttribute, etc.)
// - Template literal nodes (TemplateLiteral, etc.)

AST Node Support

Advanced Features

Advanced functionality including multi-source handling, custom formatting, and integration utilities.

// Multi-source usage
const sources = {
  'file1.js': 'source code 1',
  'file2.js': 'source code 2'
};
const result = generate(combinedAst, { sourceMaps: true }, sources);

// Helper utilities for whitespace and parentheses detection
function needsWhitespace(node: Object, parent: Object, type: string): number;
function needsParens(node: Object, parent: Object, printStack: Array): boolean;

Advanced Features

Install with Tessl CLI

npx tessl i tessl/npm-babel-generator
Workspace
tessl
Visibility
Public
Created
Last updated
Describes
npmpkg:npm/babel-generator@6.26.x
Publish Source
CLI
Badge
tessl/npm-babel-generator badge