CtrlK
BlogDocsLog inGet started
Tessl Logo

tessl/npm-parcel--transformer-typescript-types

A Parcel transformer that processes TypeScript files to generate declaration files (.d.ts) with tree-shaking and module graph optimization

Pending

Quality

Pending

Does it follow best practices?

Impact

Pending

No eval scenarios have been run

Overview
Eval results
Files

transformer.mddocs/

TypeScript Transformer

Main Parcel transformer that processes TypeScript source files to generate optimized TypeScript declaration files (.d.ts) with tree-shaking and module graph optimization.

Capabilities

TSTypesTransformer (Default Export)

The main transformer instance that integrates with Parcel's plugin system to process TypeScript files.

/**
 * Main Parcel transformer instance
 * Exported as default export from the package
 */
const TSTypesTransformer: {
  /**
   * Loads TypeScript configuration for the transformer
   * @param config - Parcel config object with project paths and options
   * @param options - Parcel options including inputFS, outputFS, and project paths
   * @returns Promise resolving to TypeScript compiler options merged with defaults
   */
  loadConfig(config: ParcelConfig, options: ParcelOptions): Promise<CompilerOptions>;
  
  /**
   * Transforms TypeScript source files to declaration files
   * @param asset - Parcel asset object with filePath, getCode(), setCode(), setMap() methods
   * @param config - TypeScript compiler options from loadConfig
   * @param options - Parcel options with inputFS, outputFS, projectRoot, etc.
   * @param logger - Parcel logger with warn(), error(), verbose() methods
   * @returns Promise resolving to array containing the transformed asset
   */
  transform(
    asset: ParcelAsset, 
    config: CompilerOptions, 
    options: ParcelOptions, 
    logger: ParcelLogger
  ): Promise<ParcelAsset[]>;
};

/**
 * Parcel asset interface for transformer input/output
 */
interface ParcelAsset {
  filePath: string;
  type: string;
  getCode(): string;
  setCode(code: string): void;
  setMap(sourceMap: any): void;
  invalidateOnFileChange(filePath: string): void;
}

/**
 * Parcel configuration interface
 */
interface ParcelConfig {
  [key: string]: any;
}

/**
 * Parcel options interface with file system and project information
 */
interface ParcelOptions {
  inputFS: any;
  outputFS: any;
  projectRoot: string;
  [key: string]: any;
}

/**
 * Parcel logger interface for diagnostic output
 */
interface ParcelLogger {
  warn(diagnostic: any): void;
  error(diagnostic: any): void;
  verbose(message: string): void;
}

Usage Example:

// This transformer is used internally by Parcel
// Configuration in .parcelrc:
{
  "extends": "@parcel/config-default",
  "transformers": {
    "*.ts": ["@parcel/transformer-typescript-types"]
  }
}

Transformation Process

The transformer follows a sophisticated multi-step process:

  1. Configuration Loading: Uses @parcel/ts-utils to load TypeScript configuration with Parcel-specific overrides
  2. Program Creation: Creates a TypeScript program using the compiler API with a custom CompilerHost
  3. Module Graph Building: Collects all modules and their dependencies using the collect transform
  4. Tree-shaking: Removes unused types and renames symbols using the shake transform
  5. Declaration Generation: Emits optimized .d.ts files with source maps
  6. Diagnostic Processing: Converts TypeScript diagnostics to Parcel diagnostics format

Compiler Options

The transformer applies specific TypeScript compiler options optimized for declaration file generation:

/**
 * TypeScript compiler options used by the transformer
 * These override user tsconfig.json settings for optimal declaration generation
 */
interface CompilerOptions {
  jsx: 'react';                    // Default JSX emit mode (users can override via tsconfig)
  moduleResolution: 'node';        // Node.js module resolution strategy
  noEmit: false;                   // Allow TypeScript to emit files
  noEmitOnError: false;            // Continue emission even with compilation errors
  declaration: true;               // Generate .d.ts declaration files
  declarationMap: true;            // Generate source maps for declaration files
  isolatedModules: false;          // Allow cross-module type analysis for optimization
  emitDeclarationOnly: true;       // Only emit .d.ts files, skip .js generation
  outFile: 'index.d.ts';          // Single output file (overridden by Parcel)
  composite: false;                // Disable TypeScript composite projects
  incremental: false;              // Disable incremental compilation (incompatible with createProgram)
  
  // Additional TypeScript options merged from user configuration
  [option: string]: any;
}

Asset Processing

The transformer modifies the Parcel asset in the following ways:

  • File Watching: Registers dependencies for file change invalidation
  • Type Setting: Changes asset type to 'ts' for declaration files
  • Code Generation: Sets the tree-shaken declaration code
  • Source Maps: Applies generated source maps for debugging support

Error Handling

The transformer provides comprehensive error handling:

  • TypeScript Diagnostics: Converts TypeScript compiler errors to Parcel format
  • Diagnostic Deduplication: Removes duplicate error messages
  • Code Frame Generation: Creates highlighted code snippets for errors
  • Graceful Degradation: Continues processing when possible, reporting warnings for non-fatal issues

Install with Tessl CLI

npx tessl i tessl/npm-parcel--transformer-typescript-types

docs

ast-processing.md

index.md

module-graph.md

transformer.md

ts-compatibility.md

tile.json