指南
配置
插件
API
社区
指南
配置
插件
API
社区
简体中文

tools.swc

  • 类型： Object | Function
  • 版本： >= 0.4.11
  • 默认值：
const defaultOptions = {
  jsc: {
    externalHelpers: true,
    parser: {
      tsx: false,
      syntax: 'typescript',
      decorators: true,
    },
    preserveAllComments: true,
  },
  isModule: 'unknown',
  // ...some other conditional options
};

通过 tools.swc 可以设置 builtin:swc-loader 的选项。

TIP

Rsbuild 默认使用 builtin:swc-loader 来转换 JavaScript 代码，它是 swc-loader 的 Rust 版本，选项与 JS 版本的 swc-loader 保持对齐。

Object 类型

tools.swc 可以配置为一个对象，这个对象将会和内置的 builtin:swc-loader 选项进行深层合并。

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

Function 类型

tools.swc 也可以配置为一个函数，这个函数接收一个参数，即内置的 builtin:swc-loader 选项，你可以对这个对象进行修改，然后返回一份新的配置。比如：

export default {
  tools: {
    swc: (config) => {
      config.jsc ||= {};
      config.jsc.externalHelpers = false;
      return config;
    },
  },
};
TIP

tools.swc 函数返回的对象会直接作为最终使用的 builtin:swc-loader 选项，不会再与内置的 builtin:swc-loader 选项进行合并。

示例

注册 SWC 插件

tools.swc 可以用于注册 SWC 的 Wasm 插件，比如注册 @swc/plugin-styled-jsx：

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

注意，目前 SWC 的 Wasm 插件不向后兼容，SWC 插件和 Rspack 依赖的 @swc/core 的版本存在一定的绑定关系。因此，你需要选择和当前 @swc/core 版本匹配的 SWC 插件，才能使 SWC 正常执行。

更多信息可参考 SWC - Selecting the version。

启用 Emotion 支持

启用 builtin:swc-loader 对 Emotion 支持的示例：

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

更多选项可参考 @swc/plugin-emotion。

启用 Relay 支持

启用 builtin:swc-loader 对 Relay 支持的示例：

export default {
  tools: {
    swc: {
      rspackExperiments: {
        relay: true,
      },
    },
  },
};

更多选项可参考 Rspack - rspackExperiments.relay。