CtrlK
BlogDocsLog inGet started
Tessl Logo

tessl/npm-terser

JavaScript parser, mangler/compressor and beautifier toolkit for ES6+

Pending
Overview
Eval results
Files

formatting.mddocs/

Output Formatting

Comprehensive code generation and formatting system controlling whitespace, comments, quotes, semicolons, and structural formatting with extensive customization options for production and development builds.

Capabilities

Format Options

Complete output formatting configuration for controlling every aspect of generated JavaScript code appearance.

interface FormatOptions {
  /** Generate ASCII-only output (escape Unicode characters) */
  ascii_only?: boolean;
  /** @deprecated Legacy beautify option (not implemented) */
  beautify?: boolean;
  /** Always use braces for single-statement blocks */
  braces?: boolean;
  /** Comment preservation and filtering */
  comments?: boolean | 'all' | 'some' | RegExp | CommentFilter;
  /** Target ECMAScript version for output syntax */
  ecma?: ECMA;
  /** Internet Explorer 8 compatibility mode */
  ie8?: boolean;
  /** Preserve original numeric literal formats */
  keep_numbers?: boolean;
  /** Base indentation level for formatted output */
  indent_level?: number;
  /** Starting indentation for first line */
  indent_start?: number;
  /** Generate HTML script-tag compatible output */
  inline_script?: boolean;
  /** Preserve quoted property names in objects */
  keep_quoted_props?: boolean;
  /** Maximum line length before wrapping */
  max_line_len?: number | false;
  /** Code preamble (license headers, etc.) */
  preamble?: string;
  /** Preserve TypeScript-style type annotations */
  preserve_annotations?: boolean;
  /** Force quotes on all object property keys */
  quote_keys?: boolean;
  /** Quote style preference for strings */
  quote_style?: OutputQuoteStyle;
  /** Safari 10 compatibility mode */
  safari10?: boolean;
  /** Include semicolons in output */
  semicolons?: boolean;
  /** Preserve Unix shebang lines */
  shebang?: boolean;
  /** Use shorthand property syntax when possible */
  shorthand?: boolean;
  /** Source map generation options */
  source_map?: SourceMapOptions;
  /** WebKit browser compatibility mode */
  webkit?: boolean;
  /** Output width for line wrapping */
  width?: number;
  /** Wrap immediately invoked function expressions */
  wrap_iife?: boolean;
  /** Wrap function arguments in parentheses */
  wrap_func_args?: boolean;
}

type CommentFilter = (node: any, comment: CommentObject) => boolean;

interface CommentObject {
  value: string;
  type: 'comment1' | 'comment2' | 'comment3' | 'comment4';
  pos: number;
  line: number;
  col: number;
}

Comment Handling

Advanced comment preservation and filtering system for maintaining documentation and license information.

Usage Examples:

// Preserve all comments
const result = await minify(code, {
  format: {
    comments: 'all'  // Keep every comment
  }
});

// Remove all comments
const result = await minify(code, {
  format: {
    comments: false  // Strip all comments
  }
});

// Preserve license comments only
const result = await minify(code, {
  format: {
    comments: /license|copyright|@preserve/i
  }
});

// Custom comment filter
const result = await minify(code, {
  format: {
    comments: (node, comment) => {
      // Keep JSDoc comments and license headers
      return comment.value.includes('@') || 
             comment.value.toLowerCase().includes('license');
    }
  }
});

// Default behavior (some comments preserved)
const result = await minify(code, {
  format: {
    comments: 'some'  // Keep JSDoc-style comments
  }
});

Quote Style Configuration

Control string and property key quote formatting for consistency and size optimization.

enum OutputQuoteStyle {
  PreferDouble = 0,    // Use double quotes when possible
  AlwaysSingle = 1,    // Force single quotes
  AlwaysDouble = 2,    // Force double quotes
  AlwaysOriginal = 3   // Preserve original quotes
}

Usage Examples:

// Minimize quote escaping
const result = await minify(code, {
  format: {
    quote_style: OutputQuoteStyle.PreferDouble,
    quote_keys: false  // Don't quote object keys unnecessarily
  }
});

// Consistent single quotes
const result = await minify(code, {
  format: {
    quote_style: OutputQuoteStyle.AlwaysSingle
  }
});

// Preserve original formatting
const result = await minify(code, {
  format: {
    quote_style: OutputQuoteStyle.AlwaysOriginal,
    keep_quoted_props: true  // Keep quoted property names
  }
});

Whitespace and Formatting

Control indentation, line breaks, and structural formatting for readable or compact output.

Usage Examples:

// Compact output (default)
const result = await minify(code, {
  format: {
    semicolons: true,     // Always use semicolons
    braces: false        // Omit braces when possible
  }
});

// Readable output
const result = await minify(code, {
  format: {
    indent_level: 2,      // 2-space indentation
    max_line_len: 80,     // Wrap at 80 characters
    braces: true,        // Always use braces
    semicolons: true     // Always use semicolons
  }
});

// Development-friendly formatting
const result = await minify(code, {
  compress: false,       // No compression
  mangle: false,        // No mangling
  format: {
    beautify: true,      // @deprecated but works
    indent_level: 4,
    comments: true
  }
});

Browser Compatibility

Special formatting modes for legacy browser support and compatibility issues.

Usage Examples:

// Internet Explorer 8 support
const result = await minify(code, {
  format: {
    ie8: true,           // IE8 compatibility mode
    ascii_only: true,    // Escape Unicode for IE8
    quote_keys: true     // Quote all object keys
  }
});

// Safari 10 compatibility
const result = await minify(code, {
  format: {
    safari10: true       // Avoid Safari 10 bugs
  }
});

// WebKit compatibility
const result = await minify(code, {
  format: {
    webkit: true         // WebKit-specific fixes
  }
});

// Inline script compatibility
const result = await minify(code, {
  format: {
    inline_script: true  // Safe for <script> tags
  }
});

License and Preamble Handling

Manage license headers, copyright notices, and code preambles.

Usage Examples:

// Add license header
const result = await minify(code, {
  format: {
    preamble: `/*!
 * MyLibrary v1.0.0
 * Copyright (c) 2024 My Company
 * Licensed under MIT
 */`,
    comments: /license|copyright/i  // Preserve license comments
  }
});

// Preserve shebang for CLI tools
const result = await minify(cliCode, {
  format: {
    shebang: true  // Keep #!/usr/bin/env node
  }
});

Line Length and Wrapping

Control line length and code wrapping for readability and diff-friendliness.

Usage Examples:

// Unlimited line length (compact)
const result = await minify(code, {
  format: {
    max_line_len: false  // No line wrapping
  }
});

// Wrap at 120 characters
const result = await minify(code, {
  format: {
    max_line_len: 120,
    width: 120          // Consistent wrapping width
  }
});

// Short lines for mobile/narrow displays
const result = await minify(code, {
  format: {
    max_line_len: 60
  }
});

Advanced Formatting Options

Specialized formatting controls for specific use cases and code patterns.

Usage Examples:

// Function expression formatting
const result = await minify(code, {
  format: {
    wrap_iife: true,       // (function(){})() style
    wrap_func_args: true   // Wrap function arguments
  }
});

// ES6+ feature formatting
const result = await minify(code, {
  format: {
    shorthand: true,       // Use {a} instead of {a: a}
    ecma: 2020            // Modern syntax allowed
  }
});

// Preserve type information
const result = await minify(tsCode, {
  format: {
    preserve_annotations: true  // Keep type annotations
  }
});

// Numeric literal preservation
const result = await minify(code, {
  format: {
    keep_numbers: true     // Keep 0xFF instead of 255
  }
});

Source Map Integration

Generate source maps with different output configurations.

Usage Examples:

// Generate external source map
const result = await minify(code, {
  sourceMap: {
    filename: 'output.js.map',
    url: 'output.js.map'
  }
});
console.log(result.map);  // Source map JSON string

// Inline source map
const result = await minify(code, {
  sourceMap: {
    url: 'inline'  // Embed source map as data URI
  }
});
// Source map embedded in result.code

Types

enum OutputQuoteStyle {
  PreferDouble = 0,
  AlwaysSingle = 1,
  AlwaysDouble = 2,
  AlwaysOriginal = 3
}

interface CommentObject {
  value: string;
  type: 'comment1' | 'comment2' | 'comment3' | 'comment4';
  pos: number;
  line: number;
  col: number;
}

type CommentFilter = (node: any, comment: CommentObject) => boolean;

type ECMA = 5 | 2015 | 2016 | 2017 | 2018 | 2019 | 2020;

Install with Tessl CLI

npx tessl i tessl/npm-terser

docs

advanced.md

cli.md

compression.md

configuration.md

formatting.md

index.md

mangling.md

minification.md

tile.json