Полная схема .swcrc
### Назначение файла `.swcrc` и общая структура
Файл `.swcrc` представляет собой конфигурационный файл компилятора SWC, определяющий правила трансформации JavaScript и TypeScript кода. Он используется для управления поведением компиляции: выбором пресетов, настройкой парсера, включением или отключением определённых трансформаций, а также параметрами минификации и генерации выходного кода.
Формат файла — JSON, поддерживающий строго определённую структуру с вложенными объектами. Любые дополнительные поля, не предусмотренные схемой, могут игнорироваться или вызывать предупреждения в зависимости от версии SWC.
Базовая структура:
```json
{
"jsc": {},
"module": {},
"minify": false,
"sourceMaps": false,
"exclude": [],
"env": {}
}
```
---
### Раздел `jsc` — ядро трансформации
Раздел `jsc` (JavaScript Compiler) определяет, как SWC обрабатывает исходный код до стадии генерации выходного JavaScript.
#### Основные поля `jsc`
```json
{
"jsc": {
"parser": {},
"transform": {},
"target": "es5",
"loose": false,
"externalHelpers": false,
"keepClassNames": false,
"baseUrl": ".",
"paths": {}
}
}
```
---
### `jsc.parser` — конфигурация разбора кода
Определяет, как исходный код интерпретируется перед трансформацией.
#### JavaScript-парсер
```json
{
"jsc": {
"parser": {
"syntax": "ecmascript",
"jsx": false,
"dynamicImport": false,
"privateMethod": false,
"classProperty": false,
"optionalChaining": false,
"nullishCoalescing": false,
"decorators": false,
"decoratorsBeforeExport": false
}
}
}
```
#### TypeScript-парсер
```json
{
"jsc": {
"parser": {
"syntax": "typescript",
"tsx": true,
"decorators": true,
"dynamicImport": true
}
}
}
```
#### Параметры `parser`
* **syntax** — тип синтаксиса: `ecmascript`, `typescript`
* **jsx / tsx** — включение JSX/TSX обработки
* **dynamicImport** — поддержка `import()`
* **decorators** — включение декораторов
* **decoratorsBeforeExport** — порядок применения декораторов
* **privateMethod** — поддержка приватных методов `#method`
* **classProperty** — поля классов вне конструктора
* **optionalChaining** — оператор `?.`
* **nullishCoalescing** — оператор `??`
---
### `jsc.transform` — система преобразований
Определяет, какие синтаксические трансформации применяются к AST.
```json
{
"jsc": {
"transform": {
"react": {},
"optimizer": {},
"legacyDecorator": false,
"decoratorMetadata": false,
"useDefineForClassFields": false
}
}
}
```
---
### React-трансформация
Используется для JSX-кода.
```json
{
"jsc": {
"transform": {
"react": {
"runtime": "automatic",
"importSource": "react",
"pragma": "React.createElement",
"pragmaFrag": "React.Fragment",
"throwIfNamespace": true,
"development": false,
"useBuiltins": false
}
}
}
}
```
Параметры:
* **runtime**
* `automatic` — новый JSX runtime
* `classic` — старый режим React 17-
* **importSource** — источник JSX runtime
* **pragma / pragmaFrag** — функции компиляции JSX
* **development** — включение dev-режима
* **throwIfNamespace** — ошибка при namespace JSX
---
### Оптимизатор
```json
{
"jsc": {
"transform": {
"optimizer": {
"globals": {
"vars": {},
"envs": []
}
}
}
}
}
```
Используется для замены глобальных переменных и оптимизации окружения.
---
### `jsc.target` — целевая версия ECMAScript
Определяет уровень генерации выходного кода:
* `es3`
* `es5`
* `es2015`
* `es2016`
* `es2017`
* `es2018`
* `es2019`
* `es2020`
* `es2021`
* `es2022`
* `es2023`
Выбор влияет на необходимость полифилов и трансформаций.
---
### `jsc.loose`
Режим упрощённой генерации кода.
* `true` — менее строгая, более быстрая трансформация
* `false` — точное соответствие спецификации ECMAScript
---
### `jsc.externalHelpers`
Вынос вспомогательных функций в внешний модуль.
```json
{
"jsc": {
"externalHelpers": true
}
}
```
Используется для уменьшения размера бандла.
---
### `jsc.keepClassNames`
Сохраняет имена классов после минификации и трансформации.
```json
{
"jsc": {
"keepClassNames": true
}
}
```
---
### `jsc.baseUrl` и `jsc.paths`
Используются для резолвинга модулей.
```json
{
"jsc": {
"baseUrl": "./src",
"paths": {
"@app/*": ["app/*"]
}
}
}
```
---
### Раздел `module` — обработка модулей
Определяет формат выходных модулей.
```json
{
"module": {
"type": "es6",
"noInterop": false,
"strict": true,
"strictMode": true,
"lazy": false,
"ignoreDynamic": false
}
}
```
---
### Параметры `module`
* **type**
* `es6`
* `commonjs`
* `amd`
* `umd`
* **noInterop** — отключение совместимости ESModule/CommonJS
* **strict** — строгий режим интерпретации
* **strictMode** — добавление `"use strict"`
* **lazy** — ленивый импорт модулей
* **ignoreDynamic** — игнор динамических import()
---
### Раздел `minify` — минификация
```json
{
"minify": {
"compress": {},
"mangle": {},
"format": {}
}
}
```
---
### `minify.compress`
```json
{
"minify": {
"compress": {
"unused": true,
"dead_code": true,
"conditionals": true,
"drop_console": false,
"drop_debugger": true,
"evaluate": true
}
}
}
```
Функции:
* удаление мёртвого кода
* свёртка условий
* удаление `debugger`
* частичное вычисление выражений
---
### `minify.mangle`
```json
{
"minify": {
"mangle": {
"top_level": false,
"keep_fnames": false
}
}
}
```
* **top_level** — переименование глобальных символов
* **keep_fnames** — сохранение имён функций
---
### `minify.format`
```json
{
"minify": {
"format": {
"comments": false,
"ascii_only": false,
"quote_style": "auto"
}
}
}
```
---
### Раздел `sourceMaps`
```json
{
"sourceMaps": true
}
```
Возможные значения:
* `true` — inline или отдельные карты
* `false` — отключено
* `"inline"` — встроенные sourcemaps
---
### Раздел `exclude`
```json
{
"exclude": ["node_modules", "dist"]
}
```
Исключает пути из компиляции.
---
### Раздел `env` — полифилы и целевая среда
```json
{
"env": {
"targets": {
"chrome": "100",
"node": "18"
},
"mode": "usage",
"coreJs": "3"
}
}
```
---
### Параметры `env`
* **targets** — список платформ
* **mode**
* `usage` — по использованию кода
* `entry` — на основе входной точки
* **coreJs** — версия core-js для полифилов
---
### Полная расширенная схема `.swcrc`
```json
{
"jsc": {
"parser": {},
"transform": {},
"target": "es2020",
"loose": false,
"externalHelpers": false,
"keepClassNames": false,
"baseUrl": ".",
"paths": {}
},
"module": {
"type": "es6",
"strict": true,
"strictMode": true,
"lazy": false
},
"minify": false,
"sourceMaps": true,
"exclude": [],
"env": {
"targets": {},
"mode": "usage",
"coreJs": "3"
}
}
```
---
### Взаимодействие разделов конфигурации
`jsc`, `module`, `minify` и `env` работают как независимые слои обработки:
* `jsc` управляет синтаксическим преобразованием
* `module` определяет систему модулей
* `env` добавляет полифилы и адаптацию под окружение
* `minify` выполняет постобработку кода
Порядок применения влияет на итоговый AST и структуру выходного файла: сначала выполняется парсинг и трансформация, затем работа с модулями, после чего возможна минификация и генерация sourcemaps.