fix: return Plugin[] instead of PluginOption[] (#537)

Author: hi-ogawa

packages/plugin-react-oxc/CHANGELOG.md

@@ -2,6 +2,8 @@
 
 ## Unreleased
 
+### Return `Plugin[]` instead of `PluginOption[]`
+
 ## 0.2.3 (2025-06-16)
 
 ### Disable refresh transform when `server.hmr: false` is set [#502](https://github.com/vitejs/vite-plugin-react/pull/502)

packages/plugin-react-oxc/src/index.ts

@@ -1,7 +1,7 @@
 import { dirname, join } from 'node:path'
 import { fileURLToPath } from 'node:url'
 import { readFileSync } from 'node:fs'
-import type { BuildOptions, Plugin, PluginOption } from 'vite'
+import type { BuildOptions, Plugin } from 'vite'
 import {
   addRefreshWrapper,
   avoidSourceMapOption,
@@ -30,7 +30,7 @@ export interface Options {
 
 const defaultIncludeRE = /\.[tj]sx?(?:$|\?)/
 
-export default function viteReact(opts: Options = {}): PluginOption[] {
+export default function viteReact(opts: Options = {}): Plugin[] {
   const include = opts.include ?? defaultIncludeRE
   const exclude = [
     ...(Array.isArray(opts.exclude)

packages/plugin-react-swc/CHANGELOG.md

@@ -2,6 +2,8 @@
 
 ## Unreleased
 
+### Return `Plugin[]` instead of `PluginOption[]`
+
 ## 3.10.2 (2025-06-10)
 
 ### Suggest `@vitejs/plugin-react-oxc` if rolldown-vite is detected [#491](https://github.com/vitejs/vite-plugin-react/pull/491)

packages/plugin-react-swc/src/index.ts

@@ -11,7 +11,7 @@ import {
   type Options as SWCOptions,
   transform,
 } from '@swc/core'
-import type { PluginOption } from 'vite'
+import type { Plugin } from 'vite'
 import {
   addRefreshWrapper,
   getPreambleCode,
@@ -83,7 +83,7 @@ type Options = {
   disableOxcRecommendation?: boolean
 }
 
-const react = (_options?: Options): PluginOption[] => {
+const react = (_options?: Options): Plugin[] => {
   let hmrDisabled = false
   const options = {
     jsxImportSource: _options?.jsxImportSource ?? 'react',

packages/plugin-react/CHANGELOG.md

@@ -2,6 +2,16 @@
 
 ## Unreleased
 
+### Return `Plugin[]` instead of `PluginOption[]`
+
+The return type has changed from `react(): PluginOption[]` to more specialized type `react(): Plugin[]`. This allows for type-safe manipulation of plugins, for example:
+
+```tsx
+// previously this causes type errors
+react({ babel: { plugins: ['babel-plugin-react-compiler'] } })
+  .map(p => ({ ...p, applyToEnvironment: e => e.name === 'client' }))
+```
+
 ## 4.6.0 (2025-06-23)
 
 ### Add raw Rolldown support

packages/plugin-react/src/index.ts

@@ -5,7 +5,7 @@ import type * as babelCore from '@babel/core'
 import type { ParserOptions, TransformOptions } from '@babel/core'
 import { createFilter } from 'vite'
 import * as vite from 'vite'
-import type { Plugin, PluginOption, ResolvedConfig } from 'vite'
+import type { Plugin, ResolvedConfig } from 'vite'
 import {
   addRefreshWrapper,
   getPreambleCode,
@@ -109,7 +109,7 @@ export type ViteReactPluginApi = {
 const defaultIncludeRE = /\.[tj]sx?$/
 const tsRE = /\.tsx?$/
 
-export default function viteReact(opts: Options = {}): PluginOption[] {
+export default function viteReact(opts: Options = {}): Plugin[] {
   const include = opts.include ?? defaultIncludeRE
   const exclude = opts.exclude
   const filter = createFilter(include, exclude)

packages/plugin-rsc/examples/basic/vite.config.ts

@@ -23,12 +23,12 @@ export default defineConfig({
   plugins: [
     tailwindcss(),
     process.env.TEST_REACT_COMPILER
-      ? (react({
+      ? react({
           babel: { plugins: ['babel-plugin-react-compiler'] },
         }).map((p) => ({
           ...p,
-          applyToEnvironment: (e: any) => e.name === 'client',
-        })) as any)
+          applyToEnvironment: (e) => e.name === 'client',
+        }))
       : react(),
     vitePluginUseCache(),
     rsc({