#tools.swc

• Type: Object | Function
• Default: undefined

#Introduction

SWC (Speedy Web Compiler) is a transformer and minimizer for JavaScript and TypeScript based on Rust. SWC can provide the same abilities with Babel, and it's more than 10x faster than Babel.

Modern.js has a out-of-box plugin for SWC, power your Web application with Polyfill and minification, we also port some common used Babel plugins to SWC.

#Used in Rspack mode

You can set the options of builtin:swc-loader through tools.swc.

import { defineConfig } from '@modern-js/app-tools';

export default defineConfig({
  tools: {
    swc: {
      jsc: {
        externalHelpers: false,
      },
    },
  },
});

For more usage, please refer to Rsbuild - tools.swc.

#Register SWC Plugin

Modern.js supports registering SWC's Wasm plugin through tools.swc, such as registering @swc/plugin-styled-components:

export default {
  tools: {
    swc: {
      jsc: {
        experimental: {
          plugins: [['@swc/plugin-styled-components', {}]],
        },
      },
    },
  },
};

Please note that the SWC plugin is still an experimental feature, and the SWC Wasm plugin is currently not backward compatible. The version of the SWC plugin is closely tied to the version of swc_core that Rspack depends on.

This means that you must to choose an SWC plugin that matches the current version of swc_core to ensure that it works properly. If the version of the SWC plugin you are using does not match the version of swc_core that Rspack depends on, Rspack will throw the following error during the build process:

1: failed to run Wasm plugin transform. Please ensure the version of `swc_core`
   used by the plugin is compatible with the host runtime.

If you encounter the above issues, a common solution is to upgrade both the Modern.js and SWC plugins to the latest versions.

For details, please refer to Rsbuild - SWC Plugin Version.