SWC with TypeScript
In this page:
Core Concept
SWC (Speedy Web Compiler) is a Rust-based compiler that transpiles TypeScript to JavaScript significantly faster than the standard tsc compiler, used as a drop-in transform step by tools like Next.js and Jest.
Example: Core Concept
// SWC is a Rust-based compiler, much faster than tsc for transpilation
console.log("SWC transpiles TypeScript to JavaScript at high speed");
Basic Setup
A basic setup installs @swc/core and @swc/cli, then configures .swcrc with a jsc.parser set to typescript, letting swc compile .ts files from the command line or via a build tool integration.
Example: Basic Setup
// npm install --save-dev @swc/core @swc/cli
// .swcrc: { "jsc": { "parser": { "syntax": "typescript" } } }
console.log("swc CLI compiles .ts files once .swcrc is configured");
Typed Example
Like esbuild, SWC strips TypeScript types without validating them, so a "typed example" compiled through SWC alone will still run even if it contains real type errors — type checking has to happen separately via tsc.
Example: Typed Example
// SWC strips types without validating them, same tradeoff as esbuild
console.log("Code with real type errors can still compile and run via SWC");
Project Usage
In a real project, SWC commonly replaces Babel as the transform layer in tools like Jest (via @swc/jest) specifically to cut down test-suite compile time on large codebases.
Example: Project Usage
// jest.config.js: transform: { "^.+\\.tsx?$": "@swc/jest" }
console.log("SWC commonly replaces Babel as Jest's transform layer");
Best Practices
Run tsc --noEmit as a dedicated type-checking step in your CI pipeline whenever SWC is the primary compiler, since SWC's speed comes precisely from skipping the type-checking phase entirely.
Example: Best Practices
// CI step: tsc --noEmit
console.log("Run tsc --noEmit separately since SWC skips type checking");
Chapter Quiz — Complete all 6 topics to unlock
0/6 topics done
Complete these topics first: