> For AI agents: the complete documentation index is available at /llms.txt, the full documentation bundle is available at /llms-full.txt.

# React Compiler

The React Compiler is an experimental compiler introduced in React 19 that can automatically optimize your React code.

Before starting to use the React Compiler, it is recommended to read the [React Compiler documentation](https://zh-hans.react.dev/learn/react-compiler) to understand its features, current status, and usage.

## How to Use

### React 19

Modern.js enables Rsbuild's Rust-backed React Compiler integration by default through `builtin:swc-loader`.

To disable it, set `source.reactCompiler` to `false`:

```ts title="modern.config.ts"
import { appTools, defineConfig } from '@modern-js/app-tools';

export default defineConfig({
  source: {
    reactCompiler: false,
  },
  plugins: [appTools()],
});
```

### React 18

If you are using React 18, you need to configure it as follows:

1. Install `react-compiler-runtime` to allow the compiled code to run on versions before 19:

```bash
npm install react-compiler-runtime
```

2. Set the matching React Compiler target in your Modern.js configuration:

```ts title="modern.config.ts"
import { appTools, defineConfig } from '@modern-js/app-tools';

export default defineConfig({
  source: {
    reactCompiler: {
      target: '18', // or '17', depending on the React version you use
    },
  },
  plugins: [appTools()],
});
```

> For detailed code, you can refer to the [Modern.js & React Compiler example project](https://github.com/web-infra-dev/modern-js-examples/tree/main/examples/react-compiler)