From 66d16b33d3f00d9bdde050d6f61c6a8c0c260d96 Mon Sep 17 00:00:00 2001 From: Ayush Gade Date: Sat, 30 May 2026 12:29:47 +0530 Subject: [PATCH] docs: fix alternative Vite configuration for TypeScript users --- src/content/learn/react-compiler/installation.md | 16 +++++++++++++--- 1 file changed, 13 insertions(+), 3 deletions(-) diff --git a/src/content/learn/react-compiler/installation.md b/src/content/learn/react-compiler/installation.md index 0ae0df17eaf..8c0e9781f1a 100644 --- a/src/content/learn/react-compiler/installation.md +++ b/src/content/learn/react-compiler/installation.md @@ -108,17 +108,27 @@ export default defineConfig({ Alternatively, you can use the Babel plugin directly with `@rolldown/plugin-babel`: -```js {3,9} +Alternatively, you can use the Babel plugin directly with `vite-plugin-babel`: + +```js {6,12-14} // vite.config.js import { defineConfig } from 'vite'; import react from '@vitejs/plugin-react'; -import babel from '@rolldown/plugin-babel'; +import babel from 'vite-plugin-babel'; + +const ReactCompilerConfig = {} export default defineConfig({ plugins: [ react(), babel({ - plugins: ['babel-plugin-react-compiler'], + filter: /\.[jt]sx?$/, + babelConfig: { + presets: ["@babel/preset-typescript"], + plugins: [ + ["babel-plugin-react-compiler", ReactCompilerConfig], + ] + } }), ], });