CtrlK
BlogDocsLog inGet started
Tessl Logo

tessl/npm-swc--types

Comprehensive TypeScript type definitions for the SWC JavaScript/TypeScript transformation and minification APIs.

Pending
Overview
Eval results
Files

parser.mddocs/

Parser Configuration

Parser configuration for JavaScript and TypeScript syntax support. These types define comprehensive parsing options for different language features, syntax variants, and experimental proposals.

Capabilities

Main Parser Configuration

Core parsing configuration types for JavaScript and TypeScript.

/**
 * Parse options combining parser config with additional settings
 */
type ParseOptions = ParserConfig & {
  /** Parse and preserve comments */
  comments?: boolean;
  /** Parse as script instead of module */
  script?: boolean;
  /** ECMAScript target version (defaults to es3) */
  target?: JscTarget;
};

/**
 * Parser configuration union for JavaScript or TypeScript
 */
type ParserConfig = TsParserConfig | EsParserConfig;

type JscTarget = 
  | "es3" | "es5" | "es2015" | "es2016" | "es2017" 
  | "es2018" | "es2019" | "es2020" | "es2021" 
  | "es2022" | "es2023" | "es2024" | "esnext";

TypeScript Parser Configuration

Parser settings specifically for TypeScript syntax and features.

/**
 * TypeScript parser configuration
 */
interface TsParserConfig {
  /** Parser syntax identifier */
  syntax: "typescript";
  /** Enable TSX/JSX parsing in TypeScript files */
  tsx?: boolean;
  /** Enable decorator parsing */
  decorators?: boolean;
  /** @deprecated Always true - dynamic imports are in ES spec */
  dynamicImport?: boolean;
}

Usage Examples:

import type { TsParserConfig } from "@swc/types";

// Basic TypeScript parsing
const basicTs: TsParserConfig = {
  syntax: "typescript"
};

// TypeScript with JSX support
const tsxConfig: TsParserConfig = {
  syntax: "typescript",
  tsx: true
};

// TypeScript with decorators
const decoratorTs: TsParserConfig = {
  syntax: "typescript",
  decorators: true
};

// Full TypeScript feature support
const fullTs: TsParserConfig = {
  syntax: "typescript",
  tsx: true,
  decorators: true
};

ECMAScript Parser Configuration

Comprehensive JavaScript parser configuration with extensive feature flags.

/**
 * ECMAScript/JavaScript parser configuration
 */
interface EsParserConfig {
  /** Parser syntax identifier */
  syntax: "ecmascript";
  /** Enable JSX parsing */
  jsx?: boolean;
  /** Enable decorator parsing */
  decorators?: boolean;
  /** Decorators before export keyword */
  decoratorsBeforeExport?: boolean;
  /** Enable function bind operator */
  functionBind?: boolean;
  /** Enable export default from syntax */
  exportDefaultFrom?: boolean;
  /** Allow super outside method context */
  allowSuperOutsideMethod?: boolean;
  /** Allow return outside function context */
  allowReturnOutsideFunction?: boolean;
  /** Enable auto accessors */
  autoAccessors?: boolean;
  /** Enable explicit resource management */
  explicitResourceManagement?: boolean;
  
  // Deprecated features (always enabled in modern ES)
  /** @deprecated Always true - numeric separators are in ES spec */
  numericSeparator?: boolean;
  /** @deprecated Always true - class private properties are in ES spec */
  classPrivateProperty?: boolean;
  /** @deprecated Always true - private methods are in ES spec */
  privateMethod?: boolean;
  /** @deprecated Always true - class properties are in ES spec */
  classProperty?: boolean;
  /** @deprecated Always true - export namespace from is in ES spec */
  exportNamespaceFrom?: boolean;
  /** @deprecated Always true - dynamic imports are in ES spec */
  dynamicImport?: boolean;
  /** @deprecated Always true - nullish coalescing is in ES spec */
  nullishCoalescing?: boolean;
  /** @deprecated Always true - optional chaining is in ES spec */
  optionalChaining?: boolean;
  /** @deprecated Always true - import.meta is in ES spec */
  importMeta?: boolean;
  /** @deprecated Always true - top level await is in ES spec */
  topLevelAwait?: boolean;
  /** @deprecated Use importAttributes instead */
  importAssertions?: boolean;
  /** @deprecated Always true in SWC */
  importAttributes?: boolean;
}

Usage Examples:

import type { EsParserConfig } from "@swc/types";

// Basic JavaScript parsing
const basicJs: EsParserConfig = {
  syntax: "ecmascript"
};

// JavaScript with JSX
const jsxConfig: EsParserConfig = {
  syntax: "ecmascript",
  jsx: true
};

// Modern JavaScript with experimental features
const modernJs: EsParserConfig = {
  syntax: "ecmascript",
  jsx: true,
  decorators: true,
  decoratorsBeforeExport: true,
  functionBind: true,
  exportDefaultFrom: true,
  autoAccessors: true,
  explicitResourceManagement: true
};

// Flexible JavaScript parsing
const flexibleJs: EsParserConfig = {
  syntax: "ecmascript",
  allowSuperOutsideMethod: true,
  allowReturnOutsideFunction: true
};

// React-focused configuration
const reactConfig: EsParserConfig = {
  syntax: "ecmascript",
  jsx: true,
  decorators: true, // For class components with decorators
  decoratorsBeforeExport: true
};

Complete Parser Examples

Real-world parser configuration examples for different use cases.

import type { ParseOptions, ParserConfig, JscTarget } from "@swc/types";

// Next.js TypeScript configuration
const nextjsTs: ParseOptions = {
  syntax: "typescript",
  tsx: true,
  decorators: true,
  comments: true,
  target: "es2020"
};

// React library development
const reactLib: ParseOptions = {
  syntax: "typescript", 
  tsx: true,
  decorators: true,
  comments: false, // Strip comments for production
  target: "es2018"
};

// Legacy browser support
const legacyJs: ParseOptions = {
  syntax: "ecmascript",
  jsx: true,
  target: "es5"
};

// Modern Node.js application
const nodeApp: ParseOptions = {
  syntax: "typescript",
  decorators: true,
  comments: true,
  target: "es2022"
};

// Experimental features testing
const experimental: ParseOptions = {
  syntax: "ecmascript",
  jsx: true,
  decorators: true,
  decoratorsBeforeExport: true,
  functionBind: true,
  exportDefaultFrom: true,
  autoAccessors: true,
  explicitResourceManagement: true,
  allowSuperOutsideMethod: true,
  allowReturnOutsideFunction: true,
  target: "esnext"
};

// Strict parsing for production
const production: ParseOptions = {
  syntax: "typescript",
  tsx: true,
  decorators: false, // Disable experimental features
  comments: false,   // Strip comments
  target: "es2020"
};

// Development with maximum compatibility
const development: ParseOptions = {
  syntax: "typescript",
  tsx: true,
  decorators: true,
  comments: true,    // Keep comments for debugging
  script: false,     // Parse as module
  target: "esnext"   // Support latest features
};

Parser Feature Support Matrix

Overview of which features are supported in different parser configurations:

TypeScript Parser (TsParserConfig):

  • ✅ TypeScript syntax (types, interfaces, generics)
  • ✅ JSX/TSX (when tsx: true)
  • ✅ Decorators (when decorators: true)
  • ✅ All modern ES features
  • ✅ TypeScript-specific imports/exports

ECMAScript Parser (EsParserConfig):

  • ✅ Modern JavaScript syntax
  • ✅ JSX (when jsx: true)
  • ✅ Decorators (when decorators: true)
  • ✅ Experimental proposals (with feature flags)
  • ❌ TypeScript-specific syntax

Target Version Impact:

  • es3/es5: Conservative parsing, fewer modern features
  • es2015+: Modern JavaScript features enabled
  • esnext: All experimental features available

Best Practices:

  1. Use TypeScript parser for .ts/.tsx files even if not using all TypeScript features
  2. Enable comments: true in development for better debugging experience
  3. Match target to your deployment environment for optimal compatibility
  4. Enable experimental features cautiously - they may change or be removed
  5. Use script: true only for non-module code (rare in modern development)

Install with Tessl CLI

npx tessl i tessl/npm-swc--types

docs

assumptions.md

ast-nodes.md

configuration.md

index.md

jsx.md

minification.md

modules.md

parser.md

typescript.md

tile.json