CtrlK
BlogDocsLog inGet started
Tessl Logo

tessl/npm-terser-webpack-plugin

Webpack plugin that integrates Terser JavaScript minifier for code optimization and compression

—

Pending
Overview
Eval results
Files

minifiers.mddocs/

Minification Functions

Built-in minification implementations for different JavaScript minifiers, each with specific optimization capabilities and performance characteristics.

Capabilities

Terser Minify

Default minification function using the Terser JavaScript minifier for comprehensive code optimization.

/**
 * Minifies JavaScript using Terser
 * @param input - Object mapping filenames to source code
 * @param sourceMap - Optional source map input
 * @param minimizerOptions - Terser-specific options
 * @param extractComments - Comment extraction configuration
 * @returns Promise resolving to minification result
 */
static terserMinify(
  input: Input,
  sourceMap?: SourceMapInput,
  minimizerOptions?: TerserOptions,
  extractComments?: ExtractCommentsOptions
): Promise<MinimizedResult>;

Usage Examples:

const TerserPlugin = require('terser-webpack-plugin');

// Using default terser minifier (implicit)
new TerserPlugin();

// Explicit terser configuration
new TerserPlugin({
  minify: TerserPlugin.terserMinify,
  terserOptions: {
    compress: {
      drop_console: true,
      drop_debugger: true,
      pure_funcs: ['console.log'],
    },
    mangle: {
      reserved: ['$', 'jQuery'],
    },
    format: {
      comments: false,
    },
  },
});

// Direct function usage
const result = await TerserPlugin.terserMinify(
  { 'main.js': 'function test() { console.log("hello"); }' },
  undefined,
  { compress: { drop_console: true } }
);

UglifyJS Minify

Minification function using UglifyJS for JavaScript code compression and optimization.

/**
 * Minifies JavaScript using UglifyJS
 * @param input - Object mapping filenames to source code
 * @param sourceMap - Optional source map input
 * @param minimizerOptions - UglifyJS-specific options
 * @param extractComments - Comment extraction configuration
 * @returns Promise resolving to minification result
 */
static uglifyJsMinify(
  input: Input,
  sourceMap?: SourceMapInput,
  minimizerOptions?: UglifyJSOptions,
  extractComments?: ExtractCommentsOptions
): Promise<MinimizedResult>;

Usage Examples:

const TerserPlugin = require('terser-webpack-plugin');

// Using UglifyJS minifier
new TerserPlugin({
  minify: TerserPlugin.uglifyJsMinify,
  terserOptions: {
    compress: {
      drop_console: true,
    },
    mangle: true,
    output: {
      beautify: false,
      comments: false,
    },
  },
});

SWC Minify

Minification function using SWC (Speedy Web Compiler) for fast JavaScript/TypeScript minification.

/**
 * Minifies JavaScript using SWC
 * @param input - Object mapping filenames to source code
 * @param sourceMap - Optional source map input
 * @param minimizerOptions - SWC-specific options
 * @returns Promise resolving to minification result
 */
static swcMinify(
  input: Input,
  sourceMap?: SourceMapInput,
  minimizerOptions?: SWCOptions
): Promise<MinimizedResult>;

Usage Examples:

const TerserPlugin = require('terser-webpack-plugin');

// Using SWC minifier
new TerserPlugin({
  minify: TerserPlugin.swcMinify,
  terserOptions: {
    compress: true,
    mangle: true,
  },
});

ESBuild Minify

Minification function using ESBuild for extremely fast JavaScript/TypeScript minification.

/**
 * Minifies JavaScript using ESBuild
 * @param input - Object mapping filenames to source code
 * @param sourceMap - Optional source map input
 * @param minimizerOptions - ESBuild-specific options
 * @returns Promise resolving to minification result
 */
static esbuildMinify(
  input: Input,
  sourceMap?: SourceMapInput,
  minimizerOptions?: ESBuildOptions
): Promise<MinimizedResult>;

Usage Examples:

const TerserPlugin = require('terser-webpack-plugin');

// Using ESBuild minifier
new TerserPlugin({
  minify: TerserPlugin.esbuildMinify,
  terserOptions: {
    target: 'es2018',
    minify: true,
    legalComments: 'none',
  },
});

Custom Minify Function

Create custom minification implementations by following the minifier interface.

/**
 * Custom minification function interface
 * @param input - Object mapping filenames to source code
 * @param sourceMap - Optional source map input
 * @param minifyOptions - Custom minifier options
 * @param extractComments - Comment extraction configuration
 * @returns Promise resolving to minification result
 */
interface MinimizerImplementation<T> {
  (
    input: Input,
    sourceMap: SourceMapInput | undefined,
    minifyOptions: MinimizerOptions<T>,
    extractComments?: ExtractCommentsOptions
  ): Promise<MinimizedResult>;
  getMinimizerVersion?(): string | undefined;
  supportsWorkerThreads?(): boolean | undefined;
}

Usage Examples:

const TerserPlugin = require('terser-webpack-plugin');

// Custom minifier function
const customMinify = async (input, sourceMap, options) => {
  // Custom minification logic
  const [[filename, code]] = Object.entries(input);
  
  // Your custom minification implementation
  const minifiedCode = yourCustomMinifier(code, options);
  
  return {
    code: minifiedCode,
    map: sourceMap,
    extractedComments: [],
  };
};

// Add version and worker support info
customMinify.getMinimizerVersion = () => '1.0.0';
customMinify.supportsWorkerThreads = () => true;

// Use custom minifier
new TerserPlugin({
  minify: customMinify,
  terserOptions: {
    // Your custom options
    level: 'aggressive',
  },
});

Minifier Comparison

Worker Thread Support

Different minifiers have different worker thread capabilities:

// Worker thread support by minifier
TerserPlugin.terserMinify.supportsWorkerThreads();    // true
TerserPlugin.uglifyJsMinify.supportsWorkerThreads();  // true  
TerserPlugin.swcMinify.supportsWorkerThreads();       // false
TerserPlugin.esbuildMinify.supportsWorkerThreads();   // false

Version Information

Get version information for installed minifiers:

// Get minifier versions
TerserPlugin.terserMinify.getMinimizerVersion();    // e.g., "5.31.1"
TerserPlugin.uglifyJsMinify.getMinimizerVersion();  // e.g., "3.18.0"
TerserPlugin.swcMinify.getMinimizerVersion();       // e.g., "1.3.102"
TerserPlugin.esbuildMinify.getMinimizerVersion();   // e.g., "0.19.11"

Types

interface Input {
  [file: string]: string;
}

interface MinimizedResult {
  code: string;
  map?: SourceMapInput;
  errors?: (string | Error)[];
  warnings?: (string | Error)[];
  extractedComments?: string[];
}

type MinimizerOptions<T> = PredefinedOptions<T> & T;

interface PredefinedOptions<T> {
  module?: boolean | string;
  ecma?: number | string;
}

type SourceMapInput = any; // From @jridgewell/trace-mapping

type ExtractCommentsOptions = 
  | boolean
  | string
  | RegExp
  | ExtractCommentsFunction
  | ExtractCommentsObject;

Install with Tessl CLI

npx tessl i tessl/npm-terser-webpack-plugin

docs

index.md

minifiers.md

plugin-configuration.md

utilities.md

tile.json