SWC Setup for JavaScript/TypeScript Transpilation

SWC Configuration for JavaScript/TypeScript Transpilation

SWC (Speedy Web Compiler) is a Rust-written transpiler compatible with Babel in transformations. It's 20–70 times faster than Babel on cold build. Next.js uses SWC by default since version 12. Vite uses it for TypeScript via esbuild, for JSX transformations via plugin. Jest with @swc/jest runs tests noticeably faster than with babel-jest.

Standalone installation

npm install --save-dev @swc/core @swc/cli

.swcrc — main config:

{
  "$schema": "https://swc.rs/schema.json",
  "jsc": {
    "parser": {
      "syntax": "typescript",
      "tsx": true,
      "decorators": true,
      "dynamicImport": true
    },
    "transform": {
      "react": {
        "runtime": "automatic",
        "development": false,
        "refresh": false
      },
      "legacyDecorator": false,
      "decoratorMetadata": false
    },
    "target": "es2020",
    "loose": false,
    "externalHelpers": true,
    "keepClassNames": true
  },
  "env": {
    "targets": "> 0.5%, last 2 versions, not dead",
    "mode": "usage",
    "coreJs": "3"
  },
  "minify": false
}

npm install @swc/helpers  # externalHelpers: true — shared helpers instead of inline
npm install core-js@3     # for polyfills via env.mode: "usage"

Webpack integration via swc-loader

npm install --save-dev swc-loader

// webpack.config.js
module.exports = {
  module: {
    rules: [
      {
        test: /\.(ts|tsx|js|jsx)$/,
        exclude: /node_modules/,
        use: {
          loader: 'swc-loader',
          // options can be set inline or left empty — reads .swcrc
        },
      },
    ],
  },
};

Replacing babel-loader with swc-loader in real projects gives 3–5x build acceleration.

Jest with @swc/jest

npm install --save-dev @swc/jest

// jest.config.mjs
export default {
  transform: {
    '^.+\\.(ts|tsx|js|jsx)$': [
      '@swc/jest',
      {
        jsc: {
          parser: {
            syntax: 'typescript',
            tsx: true,
            decorators: true,
          },
          transform: {
            react: { runtime: 'automatic' },
          },
        },
        env: {
          targets: 'node16',
          mode: 'usage',
          coreJs: '3',
        },
      },
    ],
  },
  testEnvironment: 'node',
};

Timeline

Replacing Babel with SWC in existing project: 2–4 hours including testing. Setting up SWC for new project: 30–60 minutes.