Интеграция SWC в Rollup основана на концепции трансформационного плагина, который заменяет традиционный этап транспиляции (Babel, TypeScript compiler) высокопроизводительным компилятором на Rust. В связке с Rollup SWC выполняет роль AST-трансформера, преобразующего исходный JavaScript/TypeScript в код, совместимый с целевой средой выполнения, до этапа бандлинга.
Rollup строит граф модулей, после чего каждый модуль проходит через цепочку плагинов. Плагин SWC перехватывает процесс загрузки модуля и выполняет трансформацию исходного кода, возвращая Rollup уже готовый JavaScript. Таким образом, SWC становится промежуточным слоем между файловой системой и системой сборки.
Ключевая особенность подхода заключается в том, что SWC не участвует в бандлинге, tree-shaking или резолве зависимостей. Его зона ответственности ограничена синтаксическими преобразованиями: TypeScript → JavaScript, JSX → JavaScript, современный ECMAScript → совместимый ECMAScript.
Интеграция требует наличия Rollup и SWC core-библиотеки:
npm install -D rollup @swc/core @rollup/plugin-swc
В типичных реализациях также подключается конфигурационный файл SWC:
{
"jsc": {
"parser": {
"syntax": "typescript",
"tsx": true,
"decorators": true
},
"transform": {
"react": {
"runtime": "automatic"
}
},
"target": "es2019"
},
"module": {
"type": "es6"
},
"sourceMaps": true
}
Файл .swcrc становится центральной точкой управления
трансформациями, аналогично tsconfig.json в
TypeScript-пайплайне или конфигурации Babel.
Минимальная конфигурация Rollup:
import swc from &
export default {
input: 'src/index.ts',
output: {
file: 'dist/bundle.js',
format: 'esm',
sourcemap: true
},
plugins: [
swc({
jsc: {
parser: {
syntax: 'typescript',
tsx: true
},
target: 'es2020'
}
})
]
};
В этом режиме SWC полностью заменяет TypeScript transpile-only режим. Проверка типов не выполняется — выполняется только синтаксическое преобразование.
Плагин перехватывает несколько ключевых стадий:
load — получение исходного содержимого модуля
transform — преобразование кода через SWC
resolveId — опционально влияет на резолвинг (в редких
конфигурациях)
Основная нагрузка приходится на transform, где SWC вызывает
Rust-ядро через NAPI.
Упрощённая схема:
SWC обрабатывает TypeScript без проверки типов. Это принципиальное
отличие от tsc.
Пример включения TypeScript:
swc({
jsc: {
parser: {
syntax: 'typescript'
},
target: 'es2020'
}
})
Особенности поведения:
SWC включает встроенный JSX-трансформер, который заменяет Babel preset-react.
Конфигурация React runtime:
swc({
jsc: {
parser: {
syntax: 'typescript',
tsx: true
},
transform: {
react: {
runtime: 'automatic',
importSource: 'react'
}
}
}
})
Режимы JSX:
import React
JSX преобразуется напрямую в React.createElement или
автоматические JSX-runtime вызовы.
SWC написан на Rust и использует многопоточную архитектуру, что радикально сокращает время трансформации по сравнению с Babel.
Основные причины выбора SWC в Rollup-пайплайне:
В больших проектах ускорение сборки может достигать кратных значений, особенно при большом количестве TypeScript-файлов.
SWC генерирует source maps на уровне трансформации. Rollup затем агрегирует их в итоговый map бандла.
Конфигурация:
swc({
sourceMaps: true
})
Особенности:
При включённой цепочке Rollup + SWC важно избегать двойной генерации sourcemaps, так как это может приводить к смещению координат.
Плагин поддерживает ограничение области трансформации:
swc({
include: ['src/**'],
exclude: ['node_modules/**']
})
Поведение:
Это критично в монорепозиториях, где часть зависимостей уже транспилирована.
SWC поддерживает экспериментальные и legacy-декораторы:
swc({
jsc: {
parser: {
syntax: 'typescript',
decorators: true
},
transform: {
legacyDecorator: true
}
}
})
Особенности:
SWC позволяет управлять форматом модулей до этапа Rollup:
swc({
module: {
type: 'es6'
}
})
Возможные режимы:
В Rollup чаще всего SWC оставляет ESM без преобразования модульной системы, чтобы Rollup мог выполнить tree-shaking.
SWC не влияет напрямую на tree-shaking, но может косвенно изменять его эффективность через трансформации:
Рекомендуемая стратегия — минимизировать трансформации SWC, оставляя Rollup максимальную свободу анализа зависимостей.
SWC поддерживает внутренние оптимизации компиляции, а Rollup может кэшировать результаты через watch mode.
Практическая модель:
Это особенно важно в больших проектах с десятками тысяч модулей.
В монорепозиториях SWC часто применяется для унификации трансформации пакетов:
.swcrc на корневом уровне
Типичная структура:
packages/
ui/
core/
utils/
.swcrc
rollup.config.js
Несовместимость синтаксиса и target
Несоответствие target может привести к генерации кода,
который Rollup не ожидает обрабатывать (например, слишком современный
JS).
Двойная транспиляция
Использование TypeScript plugin вместе со SWC приводит к деградации производительности и конфликтам AST-результатов.
Source map drift
Неправильная цепочка source map трансформаций вызывает смещение строк в DevTools.
Плагины Rollup, зависящие от Babel AST
Некоторые Rollup-плагины ожидают Babel AST, тогда как SWC генерирует собственную структуру до момента передачи Rollup, что может ограничивать совместимость.
SWC:
Babel:
В Rollup SWC чаще применяется в сценариях, где критична скорость сборки, а трансформации предсказуемы и стандартизированы.
SWC позволяет реализовывать сложные конфигурации:
Пример:
swc({
jsc: {
target: 'es2022',
transform: {
constModules: true,
optimizer: {
globals: {
vars: {
__DEV__: 'true'
}
}
}
}
}
})
В режиме rollup -w SWC используется повторно без повторной
инициализации компилятора для каждого файла. Это снижает накладные
расходы и ускоряет инкрементальные сборки.
Ключевая оптимизация заключается в том, что SWC выполняет трансформацию как чистую функцию от входного файла, что делает его предсказуемым в watch-сценариях.
SWC в Rollup становится заменой традиционного Babel-пайплайна в современных фронтенд-стековых архитектурах. Его использование особенно характерно для:
Интеграция через @rollup/plugin-swc
формирует компактный, быстрый и предсказуемый этап трансформации,
минимизируя зависимость от JavaScript-рантайм инструментов и повышая
стабильность сборки в крупных кодовых базах.