✨ Major Changes
-
#17951
e5b0ac4Thanks @hanford! - Migrates the React integration to@vitejs/plugin-reactv6, using Oxc for JSX and Fast Refresh. Removes thebabelintegration option; projects with custom Babel transforms must configure@rolldown/plugin-babelundervite.pluginsinstead.Adds an opt-in
compileroption for the Oxc-based React Compiler. Installoxc-transform-reactand enable it in your Astro config:import react from '@astrojs/react';export default {integrations: [react({ compiler: true })],};The compiler memoizes client components and hooks. Server rendering is not compiled. The target defaults to the installed React major version; React 17 and 18 projects also need
react-compiler-runtimeinstalled. Pass an options object to configure the compiler, for examplecompiler: { compilationMode: 'annotation' }. The integration’sincludeandexcludeoptions apply, and dependencies and Astro files are excluded.The integration uses
@vitejs/plugin-reactv6 and Oxc for JSX and Fast Refresh. Thebabelintegration option has been removed in this major release.If you use custom Babel transforms, install
@rolldown/plugin-babeland@babel/core, keeping your existing Babel plugins and presets installed:Terminal window pnpm add -D @rolldown/plugin-babel @babel/coreMove your Babel plugins and presets from
react({ babel: ... })tobabel()invite.plugins. For example, migrate a project usingbabel-plugin-styled-componentsfrom:import react from '@astrojs/react';import { defineConfig } from 'astro/config';export default defineConfig({integrations: [react({ babel: { plugins: ['babel-plugin-styled-components'] } })],});To:
import react from '@astrojs/react';import babel from '@rolldown/plugin-babel';import { defineConfig } from 'astro/config';export default defineConfig({integrations: [react()],vite: {plugins: [babel({plugins: ['babel-plugin-styled-components'],}),],},});This also works with
react({ compiler: true }). Babel runs before Oxc transforms TypeScript and JSX. The Babel plugin automatically enables parsing for.jsx,.ts, and.tsxfiles. It does not loadbabel.config.jsor.babelrcfiles; pass the options directly tobabel(). The oldbabelcallback is not supported; use the plugin’soverridesand preset hooks for conditional transforms.Do not enable
babel-plugin-react-compileron the same components as the Oxc compiler.