SWC is an extensible Rust-based platform for the next generation of fast developer tools. This plugin is designed to replace rollup-plugin-typescript2
, @rollup/plugin-typescript
, @rollup/plugin-babel
and rollup-plugin-terser
for you.
sukkaw/rollup-plugin-swc | mentaljam/rollup-plugin-swc | nicholasxjy/rollup-plugin-swc2 | |
---|---|---|---|
minify your bundle in one pass1 |
Yes | No | No |
Standalone swcMinify plugin |
Yes | No | No |
Config Intellisense2 | Yes | No | No |
Reads your tsconfig.json and jsconfig.json |
Yes | No | No |
ESM export | Full | Partial3 | No |
TypeScrit declarations | Yes | Yes | Yes |
Has testing | Yes | No | No |
$ npm i @swc/core rollup-plugin-swc3
# If you prefer yarn
# yarn add @swc/core rollup-plugin-swc3
# If you prefer pnpm
# pnpm add @swc/core rollup-plugin-swc3
// rollup.config.js
import { swc } from 'rollup-plugin-swc3';
export default {
input: 'xxxx',
output: {},
plugins: [
swc({
// All options are optional
include: /\.[mc]?[jt]sx?$/, // default
exclude: /node_modules/, // default
tsconfig: 'tsconfig.json', // default
// tsconfig: false, // You can also prevent `rollup-plugin-swc` from reading tsconfig.json, see below
// And add your swc configuration here!
// "filename" will be ignored since it is handled by rollup
jsc: {}
}),
];
}
If you want autocompletion in your IDE or type check:
import { swc, defineRollupSwcOption } from 'rollup-plugin-swc3';
export default {
input: 'xxxx',
output: {},
plugins: [
swc(defineRollupSwcOption({
// ... There goes the plugin's configuration
})),
];
}
// or
/** @type {import('rollup-plugin-swc3').PluginOptions} */
const swcPluginConfig = {}
- Type:
string | RegExp | Array<String | RegExp>
- Default:
/node_modules/
A picomatch pattern, or array of patterns, which specifies the files in the build the plugin should ignore.
- Type:
string[]
- Default:
['.ts', '.tsx', '.mjs', '.js', '.cjs', '.jsx']
Specifies the files in the build the plugin should operate on. Also, the plugin will search and resolve files for extensions in the order specified for extensionless imports.
- Type:
string | RegExp | Array<String | RegExp>
- Default:
/\.[mc]?[jt]sx?$/
A picomatch pattern, or array of patterns, which specifies the files in the build the plugin should operate on.
- Type:
string | false | undefined
- Default:
'tsconfig.json'
rollup-plugin-swc
will read your tsconfig.json
or jsconfig.json
for default values if your doesn't provide corresponding swc options:
- The configuration your passed to
rollup-plugin-swc
will always have the highest priority (higher thantsconfig.json
/jsconfig.json
). rollup-plugin-swc
will find the nearesttsconfig.json
/jsconfig.json
from the file that is currently being transpiled. This behavior is slightly different fromtsc
.- You can also provide a custom filename (E.g.
tsconfig.rollup.json
,jsconfig.compile.json
) totsconfig
option, androllup-plugin-swc
will find and resolve the nearest file with that filename. - You can also provide an absolute path (E.g.
/path/to/your/tsconfig.json
) totsconfig
option, androllup-plugin-swc
will only use the provided path as a single source of truth.
- You can also provide a custom filename (E.g.
- You can prevent
rollup-plugin-swc
from readingtsconfig.json
/jsconfig.json
by settingtsconfig
option tofalse
. jsconfig.json
will be ignored iftsconfig.json
andjsconfig.json
both exist.- The
extends
oftsconfig.json
/jsconfig.json
isnot supportednow supported. compilerOptions.target
will be passed to swc'sjsc.target
.compilerOptions.jsxImportSource
,compilerOptions.jsxFactory
, andcompilerOptions.jsxFragmentFactory
will be passed to swc'sjsc.transform.react.importSource
,jsc.transform.react.pragma
andjsc.transform.react.pragmaFrag
.- When
compilerOptions.jsx
is eitherreact-jsx
orreact-jsxdev
, swc'sjsc.transform.react.runtime
will beautomatic
, otherwise it will beclassic
.compilerOptions.jsx: react-jsxdev
will also set swc'sjsc.transform.react.development
totrue
.compilerOptions.jsx: preserve
will be ignored. swc will always transpile your jsx into javascript code.
compilerOptions.baseUrl
andcompilerOptions.paths
will be passed to swc'sjsc.baseUrl
andjsc.paths
directly. They won't affect how rollup resolve your imports. If you have encounted any issue during bundling, please use other plugins to resolve your imports' aliases (e.g., add rollup-plugin-typescript-paths or rollup-plugin-tsconfig-paths before@rollup/plugin-node-resolve
).compilerOptions.importHelpers
will be passed to swc'sjsc.externalHelpers
. You will have to have@swc/helpers
avaliable in your project when enabled.compilerOptions.experimentalDecorators
andcompilerOptions.emitDecoratorMetadata
will be passed to swc'sjsc.parser.decorators
andjsc.transform.decoratorMetadata
.compilerOptions.esModuleInterop
will always be ignored, as swc requiresmodule.type
to exist whenmodule.noInterop
is given.
If you only want to use swc
to minify your bundle:
import { minify } from 'rollup-plugin-swc3'
export default {
plugins: [
minify({
// swc's minify option here
// mangle: {}
// compress: {}
}),
],
}
If you want autocompletion in your IDE or type check:
import { minify, defineRollupSwcMinifyOption } from 'rollup-plugin-swc3'
export default {
plugins: [
minify(
defineRollupSwcMinifyOption({
// swc's minify option here
// mangle: {}
// compress: {}
})
),
],
}
// or
/** @type {import('@swc/core').JsMinifyOptions} */
const swcMinifyConfig = {}
You can write your Rollup config file in rollup.config.ts
, and use the following command:
rollup --config rollup.config.ts --configPlugin swc3
There are serveral ways to generate declaration file:
- Use
tsc
withemitDeclarationOnly
, the slowest way but you get type checking, it doesn't bundle the.d.ts
files. - Use
rollup-plugin-dts
which generates and bundle.d.ts
, also does type checking. It is used by this plugin as well.
You can either configure it in your tsconfig.json
or in your rollup.config.js
.
// Vue JSX
import { swc, defineRollupSwcOption } from 'rollup-plugin-swc3';
export default {
input: 'xxxx',
output: {},
plugins: [
swc(defineRollupSwcOption({
jsc: {
experimental: {
plugins: [['swc-plugin-vue-jsx', {}]] // npm i swc-plugin-vue-jsx
}
}
})),
];
}
// Preact
import { swc, defineRollupSwcOption } from 'rollup-plugin-swc3';
export default {
input: 'xxxx',
output: {},
plugins: [
swc(defineRollupSwcOption({
jsc: {
transform:{
react: {
pragma: 'h',
pragmaFrag: 'Fragment'
// To use preact/jsx-runtime:
// importSource: 'preact',
// runtime: 'automatic'
}
}
}
})),
];
}
rollup-plugin-swc © Sukka, Released under the MIT License.
Inspired by egoist's rollup-plugin-esbuild.
Authored and maintained by Sukka with help from contributors (list).
Personal Website · Blog · GitHub @SukkaW · Telegram Channel @SukkaChannel · Twitter @isukkaw · Keybase @sukka
Footnotes
-
If minify is called in Rollup's
transform
phase, every individual module processed will result in a minify call. However, if minify is called in Rollup'srenderChunk
phase, the minify will only be called once in one whole pass before Rollup generates bundle, results in a faster build. ↩ -
Autocompletion and type checking in your IDE ↩
-
mentaljam/rollup-plugin-swc
has bothmain
andmodule
fields inpackage.json
, but has noexports
field. ↩