CtrlK
BlogDocsLog inGet started
Tessl Logo

tessl/npm-fork-ts-checker-webpack-plugin

Runs TypeScript type checker and linter on separate process for webpack builds.

Pending
Quality

Pending

Does it follow best practices?

Impact

Pending

No eval scenarios have been run

SecuritybySnyk

Pending

The risk profile of this skill

Overview
Eval results
Files

plugin-configuration.mddocs/

Plugin Configuration

Core plugin instantiation and configuration options for integrating with webpack builds. The ForkTsCheckerWebpackPlugin provides a comprehensive set of options for controlling type checking behavior, output formatting, and process management.

Capabilities

ForkTsCheckerWebpackPlugin Class

Main plugin class that integrates with webpack's plugin system.

/**
 * Main webpack plugin class for running TypeScript type checking on separate process
 */
class ForkTsCheckerWebpackPlugin {
  /**
   * Create a new plugin instance
   * @param options - Plugin configuration options
   */
  constructor(options?: ForkTsCheckerWebpackPluginOptions);
  
  /**
   * Apply the plugin to webpack compiler (webpack plugin interface)
   * @param compiler - Webpack compiler instance
   */
  apply(compiler: webpack.Compiler): void;
  
  /**
   * Get plugin hooks for compiler to access lifecycle events
   * @param compiler - Webpack compiler instance
   * @returns Plugin hooks for tapping into lifecycle events
   */
  static getCompilerHooks(compiler: webpack.Compiler): ForkTsCheckerWebpackPluginHooks;
  
  /** Current version of the plugin */
  static readonly version: string;
  
  /** Default pool for issues worker concurrency */
  static readonly issuesPool: object;
  
  /** Default pool for dependencies worker concurrency */
  static readonly dependenciesPool: object;
  
  /** @deprecated Use issuesPool instead */
  static readonly pool: object;
}

Plugin Options Interface

Complete configuration interface for the plugin.

/**
 * Configuration options for ForkTsCheckerWebpackPlugin
 */
interface ForkTsCheckerWebpackPluginOptions {
  /**
   * Enable async mode - reports issues after webpack compilation is done
   * Defaults to true in development mode, false in production
   */
  async?: boolean;
  
  /**
   * TypeScript worker configuration options
   */
  typescript?: TypeScriptWorkerOptions;
  
  /**
   * Output formatter configuration for displaying issues
   */
  formatter?: FormatterOptions;
  
  /**
   * Issue filtering configuration (include/exclude patterns)
   */
  issue?: IssueOptions;
  
  /**
   * Logger configuration - custom logger or use webpack infrastructure
   */
  logger?: Logger | 'webpack-infrastructure';
  
  /**
   * Enable development server mode optimizations
   */
  devServer?: boolean;
}

Usage Examples:

// Basic plugin setup
new ForkTsCheckerWebpackPlugin()

// Development configuration
new ForkTsCheckerWebpackPlugin({
  async: true, // Don't block webpack compilation
  typescript: {
    configFile: './tsconfig.json',
    memoryLimit: 2048
  },
  formatter: 'codeframe',
  logger: 'webpack-infrastructure'
})

// Production configuration  
new ForkTsCheckerWebpackPlugin({
  async: false, // Block compilation on type errors
  typescript: {
    configFile: './tsconfig.prod.json',
    memoryLimit: 4096,
    mode: 'write-references'
  },
  formatter: {
    type: 'basic',
    pathType: 'relative'
  },
  issue: {
    exclude: [
      { file: '**/*.test.ts' },
      { code: 'TS2722' } // Ignore specific TypeScript error codes
    ]
  }
})

Async Mode Configuration

Controls when type checking results are reported relative to webpack compilation.

/**
 * Async mode configuration
 * - true: Reports issues after webpack compilation (non-blocking)
 * - false: Reports issues before webpack compilation completes (blocking)
 * Default: true in development mode, false otherwise
 */
async?: boolean;

Usage Scenarios:

  • Development (async: true): Faster rebuilds, type errors don't block compilation
  • Production (async: false): Ensure build fails on type errors before assets are emitted
  • CI/CD (async: false): Block deployment pipelines when type errors exist

Development Server Integration

Enables optimizations for webpack dev server environments.

/**
 * Enable development server mode optimizations
 * Provides better integration with webpack-dev-server hot reload
 */
devServer?: boolean;

When enabled, provides:

  • Better integration with webpack-dev-server hot reload
  • Optimized file watching for faster incremental checks
  • Enhanced error reporting in browser console

Configuration Sources

The plugin supports configuration from multiple sources using cosmiconfig:

// 1. Plugin constructor (highest priority)
new ForkTsCheckerWebpackPlugin({ async: false })

// 2. package.json field
{
  "fork-ts-checker": {
    "async": true,
    "typescript": { "memoryLimit": 2048 }
  }
}

// 3. .fork-ts-checkerrc (JSON/YAML)
{
  "async": true,
  "formatter": "codeframe"
}

// 4. fork-ts-checker.config.js
module.exports = {
  async: true,
  typescript: {
    configFile: './tsconfig.json'
  }
};

Configuration sources are merged using deepmerge, with plugin constructor options taking highest priority.

docs

formatters.md

index.md

issues-filtering.md

plugin-configuration.md

plugin-hooks.md

typescript-configuration.md

tile.json