#getJsTransformRules

A helper function that generates Rspack module.rules configuration for transforming JavaScript, TypeScript, and Flow files. You can consider it an equivalent of @react-native/babel-preset, but for SWC.

#Parameters

interface GetJsTransformRulesOptions {
  swc?: {
    disableImportExportTransform?: boolean;
    externalHelpers?: boolean;
    importSource?: string;
    jsxRuntime?: "automatic" | "classic";
    lazyImports?: boolean | string[];
  };
  flow?: {
    enabled?: boolean;
    include?: string[];
    exclude?: string[];
    all?: boolean;
    ignoreUninitializedFields?: boolean;
    removeEmptyImports?: boolean;
  };
  codegen?: {
    enabled?: boolean;
  };
}

#options

• Type: GetJsTransformRulesOptions
• Required: false

Configuration options for JavaScript/TypeScript transformations

#options.swc

• Type: object
• Default: {}

Configuration options for SWC transformations. For detailed documentation of the options, see getSwcLoaderOptions.

{
  swc: {
    disableImportExportTransform: false,
    externalHelpers: true,
    importSource: 'react',
    jsxRuntime: 'automatic',
    lazyImports: false,
  }
}

#options.flow

• Type: object

Configuration for enabling/disabling Flow transformations. When enabled, the transformation will be applied according to the configuration from getFlowTransformRules.

{
  flow: {
    enabled: true,
    include: FLOW_TYPED_MODULES,
    exclude: [],
    all: true,
    ignoreUninitializedFields: false,
    removeEmptyImports: true,
  }
}

#options.flow.enabled

• Type: boolean
• Default: true

Whether to enable Flow transformations in the JavaScript transform pipeline.

#options.codegen

• Type: object

Configuration for enabling/disabling codegen transformations. When enabled, the transformation will be applied according to the configuration from getCodegenTransformRules.

{
  codegen: {
    enabled: true;
  }
}

#options.codegen.enabled

• Type: boolean
• Default: true

Whether to enable codegen transformations in the JavaScript transform pipeline.

#Example

const Repack = require("@callstack/repack");

module.exports = {
  module: {
    rules: [
      ...Repack.getJsTransformRules({
        swc: {
          jsxRuntime: "automatic",
          externalHelpers: true,
        },
        flow: {
          enabled: true,
          include: ["react-native"],
        },
        codegen: {
          enabled: true,
        },
      }),
    ],
  },
};

Need React or React Native expertise you can count on?

Let's talkLet's talk