or run

npx @tessl/cli init
Log in

Version

Tile

Overview

Evals

Files

docs

cli-tools.mdconfiguration-management.mdcore-analysis.mdindex.mdoutput-formatting.mdreporter-plugins.mdrule-system.mdtranspiler-support.md
tile.json

transpiler-support.mddocs/

Transpiler Support

Access information about supported transpilers and file extensions, with runtime availability checking.

Capabilities

Available Transpilers

Get information about supported transpilers and their current availability.

/**
 * Returns an array of supported transpilers with availability information
 * @returns Array of transpiler information including version and availability
 */
function getAvailableTranspilers(): IAvailableTranspiler[];

interface IAvailableTranspiler {
  /** Name of the transpiler (e.g., "typescript", "babel") */
  name: string;
  
  /** Supported version range (semver) */
  version: string;
  
  /** Whether transpiler is available in current environment */
  available: boolean;
  
  /** Current version installed (if available) */
  currentVersion: string;
}

Usage Examples:

import { getAvailableTranspilers } from "dependency-cruiser";

// Check all available transpilers
const transpilers = getAvailableTranspilers();

transpilers.forEach(transpiler => {
  console.log(`${transpiler.name}: ${transpiler.available ? 'available' : 'not available'}`);
  if (transpiler.available) {
    console.log(`  Version: ${transpiler.currentVersion} (supports ${transpiler.version})`);
  }
});

// Check if specific transpiler is available
const typescript = transpilers.find(t => t.name === "typescript");
if (typescript?.available) {
  console.log("TypeScript analysis available");
}

// Filter only available transpilers
const availableTranspilers = transpilers.filter(t => t.available);
console.log(`${availableTranspilers.length} transpilers available`);

Supported Extensions

Get information about all supported file extensions and their availability.

/**
 * All supported file extensions with availability status
 */
const allExtensions: IAvailableExtension[];

interface IAvailableExtension {
  /** File extension (e.g., ".js", ".ts", ".vue") */
  extension: string;
  
  /** Whether extension is supported in current environment */
  available: boolean;
}

Usage Examples:

import { allExtensions } from "dependency-cruiser";

// List all supported extensions
console.log("Supported extensions:");
allExtensions.forEach(ext => {
  const status = ext.available ? "✓" : "✗";
  console.log(`  ${status} ${ext.extension}`);
});

// Get only available extensions
const availableExts = allExtensions
  .filter(ext => ext.available)
  .map(ext => ext.extension);
console.log("Available:", availableExts.join(", "));

// Check if specific extension is supported
const typescriptSupported = allExtensions.find(
  ext => ext.extension === ".ts"
)?.available;

if (typescriptSupported) {
  console.log("TypeScript files can be analyzed");
}

Supported Transpilers

Detailed information about each supported transpiler and language.

JavaScript (Always Available):

  • Extensions: .js, .cjs, .mjs, .jsx
  • Parser: Built-in (Acorn-based)
  • Features: Full ES6+ support, JSX parsing

TypeScript:

  • Extensions: .ts, .tsx, .d.ts, .cts, .mts, .d.cts, .d.mts
  • Package: typescript (>=2.0.0 <6.0.0)
  • Features: Type checking, pre-compilation dependencies, JSDoc imports
  • Configuration: Via tsconfig.json

Babel:

  • Extensions: Configurable (typically .js, .jsx, .ts, .tsx)
  • Package: @babel/core (>=7.0.0 <8.0.0)
  • Features: Custom presets and plugins
  • Configuration: Via .babelrc, babel.config.js, or package.json

CoffeeScript:

  • Extensions: .coffee, .litcoffee, .coffee.md, .csx, .cjsx
  • Packages: coffeescript (>=1.0.0 <3.0.0) or coffee-script (>=1.0.0 <2.0.0)
  • Features: CoffeeScript compilation and dependency analysis

SWC (Fast Compiler):

  • Extensions: .js, .cjs, .mjs, .jsx, .ts, .tsx, .d.ts
  • Package: @swc/core (>=1.0.0 <2.0.0)
  • Features: High-performance TypeScript/JavaScript compilation
  • Alternative: Can be used as parser override

Svelte:

  • Extensions: .svelte
  • Package: svelte/compiler (>=3.0.0 <6.0.0)
  • Features: Svelte component analysis and dependency extraction

Vue.js:

  • Extensions: .vue
  • Packages:
    • vue-template-compiler (>=2.0.0 <3.0.0) for Vue 2
    • @vue/compiler-sfc (>=3.0.0 <4.0.0) for Vue 3
  • Features: Single File Component analysis

LiveScript:

  • Extensions: .ls
  • Package: livescript (>=1.0.0 <2.0.0)
  • Features: LiveScript compilation and analysis

Runtime Environment Detection

Determine transpiler availability and configuration in the current environment.

Check Environment Setup:

import { getAvailableTranspilers, allExtensions } from "dependency-cruiser";

function analyzeEnvironment() {
  const transpilers = getAvailableTranspilers();
  const extensions = allExtensions;
  
  console.log("Environment Analysis:");
  console.log("===================");
  
  // Language support summary
  const jsSupport = extensions.filter(e => 
    [".js", ".cjs", ".mjs", ".jsx"].includes(e.extension)
  ).every(e => e.available);
  
  const tsSupport = transpilers.find(t => t.name === "typescript")?.available;
  const babelSupport = transpilers.find(t => t.name === "babel")?.available;
  
  console.log(`JavaScript: ${jsSupport ? "✓" : "✗"}`);
  console.log(`TypeScript: ${tsSupport ? "✓" : "✗"}`);
  console.log(`Babel: ${babelSupport ? "✓" : "✗"}`);
  
  // Recommended setup
  if (!tsSupport && !babelSupport) {
    console.log("\nRecommendation: Install typescript or @babel/core for enhanced analysis");
  }
  
  return {
    javascript: jsSupport,
    typescript: tsSupport,
    babel: babelSupport,
    availableExtensions: extensions.filter(e => e.available).map(e => e.extension)
  };
}

Extension to Transpiler Mapping

Understanding which transpiler is used for each file extension.

// Internal mapping (informational)
const extensionMappings = {
  // JavaScript (always available)
  ".js": "javascript",
  ".cjs": "javascript", 
  ".mjs": "javascript",
  ".jsx": "javascript",
  
  // TypeScript (requires typescript package)
  ".ts": "typescript",
  ".tsx": "typescript",
  ".d.ts": "typescript",
  ".cts": "typescript",
  ".mts": "typescript",
  ".d.cts": "typescript",
  ".d.mts": "typescript",
  
  // Vue (requires vue compiler)
  ".vue": "vue-template-compiler or @vue/compiler-sfc",
  
  // Svelte (requires svelte)
  ".svelte": "svelte",
  
  // CoffeeScript (requires coffeescript)
  ".coffee": "coffeescript",
  ".litcoffee": "coffeescript",
  ".coffee.md": "coffeescript",
  ".csx": "coffeescript",
  ".cjsx": "coffeescript",
  
  // LiveScript (requires livescript)
  ".ls": "livescript"
};

Parser Selection

Control which parser is used for analysis (advanced usage).

type ParserType = "acorn" | "tsc" | "swc";

interface ICruiseOptions {
  /** Override parser selection (experimental) */
  parser?: ParserType;
}

Parser Characteristics:

  • acorn (default): Fast, reliable JavaScript parser with JSX support
  • tsc: TypeScript compiler parser, required for TypeScript features
  • swc: Very fast Rust-based parser, good for large codebases

Usage:

import { cruise } from "dependency-cruiser";

// Force SWC parser for performance
const result = await cruise(
  ["src"],
  { 
    parser: "swc",
    // SWC must be available for this to work
  }
);

// Force TypeScript parser for detailed analysis
const result = await cruise(
  ["src"],
  { 
    parser: "tsc",
    tsPreCompilationDeps: true
  }
);

Transpiler Configuration Integration

Integrate transpiler configurations with dependency analysis.

TypeScript Integration:

import { cruise } from "dependency-cruiser";

const result = await cruise(
  ["src"],
  { 
    tsPreCompilationDeps: true,
    detectJSDocImports: true // Implies parser: "tsc"
  },
  { extensions: [".ts", ".tsx", ".js"] },
  { 
    tsConfig: { 
      fileName: "./tsconfig.json",
      compilerOptions: {
        paths: {
          "@/*": ["./src/*"]
        }
      }
    }
  }
);

Babel Integration:

import extractBabelConfig from "dependency-cruiser/config-utl/extract-babel-config";

const babelConfig = await extractBabelConfig("./.babelrc.js");

const result = await cruise(
  ["src"],
  { moduleSystems: ["es6", "cjs"] },
  {},
  { babelConfig }
);

Performance Considerations

Choose appropriate transpilers and configurations for optimal performance.

Performance Tips:

  1. Parser Selection: Use acorn for pure JavaScript, tsc only when TypeScript features needed
  2. Extension Filtering: Limit extensions in resolve options to only necessary types
  3. Transpiler Availability: Check availability before configuring complex transpiler setups
  4. Caching: Use caching when repeatedly analyzing with expensive transpilers

Optimized Setup:

import { getAvailableTranspilers } from "dependency-cruiser";

const transpilers = getAvailableTranspilers();
const hasSWC = transpilers.find(t => t.name === "swc")?.available;
const hasTypeScript = transpilers.find(t => t.name === "typescript")?.available;

const optimizedConfig = {
  // Use fast parser if available
  parser: hasSWC ? "swc" : "acorn",
  
  // Only enable TypeScript features if needed
  tsPreCompilationDeps: hasTypeScript && needsTypeScriptAnalysis,
  
  // Cache expensive transpiler operations
  cache: {
    folder: "node_modules/.cache/dependency-cruiser",
    strategy: "content" // More thorough for transpiled content
  }
};

Troubleshooting Transpiler Issues

Common issues and solutions when working with transpilers.

Missing Transpiler:

import { getAvailableTranspilers } from "dependency-cruiser";

const transpilers = getAvailableTranspilers();
const missing = transpilers.filter(t => !t.available);

if (missing.length > 0) {
  console.log("Missing transpilers:");
  missing.forEach(t => {
    console.log(`  ${t.name}: npm install ${t.name}@"${t.version}"`);
  });
}

Version Compatibility:

const typescript = transpilers.find(t => t.name === "typescript");
if (typescript && typescript.available) {
  console.log(`TypeScript ${typescript.currentVersion} found`);
  console.log(`Supports versions: ${typescript.version}`);
  
  // Check if version might cause issues
  const currentMajor = parseInt(typescript.currentVersion.split('.')[0]);
  if (currentMajor >= 5) {
    console.log("Note: TypeScript 5+ may have compatibility considerations");
  }
}