Use plugin hook filter internally

- plugin-react: Remove redundant filter check since hook filter handles it
- plugin-react-swc: Add hook filters for default file extensions (.tsx, .ts, .mts, .jsx, .mdx)
- Conditional filter application: Only use filters when parserConfig is not custom

Co-authored-by: hi-ogawa <[email protected]>

Author: Copilot

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

@@ -169,34 +169,69 @@ const react = (_options?: Options): Plugin[] => {
           ]
         }
       },
-      async transform(code, _id, transformOptions) {
-        const id = _id.split('?')[0]
-        const refresh = !transformOptions?.ssr && !hmrDisabled
+      transform: options.parserConfig
+        ? // When custom parserConfig is provided, we can't add a filter
+          // because the user controls which files are handled
+          async (code, _id, transformOptions) => {
+            const id = _id.split('?')[0]
+            const refresh = !transformOptions?.ssr && !hmrDisabled
 
-        const result = await transformWithOptions(
-          id,
-          code,
-          options.devTarget,
-          options,
-          viteCacheRoot,
-          {
-            refresh,
-            development: true,
-            runtime: 'automatic',
-            importSource: options.jsxImportSource,
-          },
-        )
-        if (!result) return
-        if (!refresh) return result
+            const result = await transformWithOptions(
+              id,
+              code,
+              options.devTarget,
+              options,
+              viteCacheRoot,
+              {
+                refresh,
+                development: true,
+                runtime: 'automatic',
+                importSource: options.jsxImportSource,
+              },
+            )
+            if (!result) return
+            if (!refresh) return result
 
-        const newCode = addRefreshWrapper(
-          result.code,
-          '@vitejs/plugin-react-swc',
-          id,
-          options.reactRefreshHost,
-        )
-        return { code: newCode ?? result.code, map: result.map }
-      },
+            const newCode = addRefreshWrapper(
+              result.code,
+              '@vitejs/plugin-react-swc',
+              id,
+              options.reactRefreshHost,
+            )
+            return { code: newCode ?? result.code, map: result.map }
+          }
+        : {
+            // Add filter for default extensions: .tsx, .ts, .mts, .jsx, .mdx
+            filter: { id: /\.(tsx?|mts|jsx|mdx)(?:$|\?)/ },
+            async handler(code, _id, transformOptions) {
+              const id = _id.split('?')[0]
+              const refresh = !transformOptions?.ssr && !hmrDisabled
+
+              const result = await transformWithOptions(
+                id,
+                code,
+                options.devTarget,
+                options,
+                viteCacheRoot,
+                {
+                  refresh,
+                  development: true,
+                  runtime: 'automatic',
+                  importSource: options.jsxImportSource,
+                },
+              )
+              if (!result) return
+              if (!refresh) return result
+
+              const newCode = addRefreshWrapper(
+                result.code,
+                '@vitejs/plugin-react-swc',
+                id,
+                options.reactRefreshHost,
+              )
+              return { code: newCode ?? result.code, map: result.map }
+            },
+          },
     },
     options.plugins || options.useAtYourOwnRisk_mutateSwcOptions
       ? {
@@ -209,18 +244,37 @@ const react = (_options?: Options): Plugin[] => {
           configResolved(config) {
             viteCacheRoot = config.cacheDir
           },
-          transform: (code, _id) =>
-            transformWithOptions(
-              _id.split('?')[0],
-              code,
-              'esnext',
-              options,
-              viteCacheRoot,
-              {
-                runtime: 'automatic',
-                importSource: options.jsxImportSource,
+          transform: options.parserConfig
+            ? // When custom parserConfig is provided, we can't add a filter
+              // because the user controls which files are handled
+              (code, _id) =>
+                transformWithOptions(
+                  _id.split('?')[0],
+                  code,
+                  'esnext',
+                  options,
+                  viteCacheRoot,
+                  {
+                    runtime: 'automatic',
+                    importSource: options.jsxImportSource,
+                  },
+                )
+            : {
+                // Add filter for default extensions: .tsx, .ts, .mts, .jsx, .mdx
+                filter: { id: /\.(tsx?|mts|jsx|mdx)(?:$|\?)/ },
+                handler: (code, _id) =>
+                  transformWithOptions(
+                    _id.split('?')[0],
+                    code,
+                    'esnext',
+                    options,
+                    viteCacheRoot,
+                    {
+                      runtime: 'automatic',
+                      importSource: options.jsxImportSource,
+                    },
+                  ),
               },
-            ),
         }
       : {
           name: 'vite:react-swc',

packages/plugin-react/src/index.ts

@@ -3,7 +3,6 @@ import { fileURLToPath } from 'node:url'
 import { readFileSync } from 'node:fs'
 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, ResolvedConfig } from 'vite'
 import {
@@ -107,7 +106,6 @@ const compilerAnnotationRE = /['"]use memo['"]/
 export default function viteReact(opts: Options = {}): Plugin[] {
   const include = opts.include ?? defaultIncludeRE
   const exclude = opts.exclude ?? defaultExcludeRE
-  const filter = createFilter(include, exclude)
 
   const jsxImportSource = opts.jsxImportSource ?? 'react'
   const jsxImportRuntime = `${jsxImportSource}/jsx-runtime`
@@ -247,7 +245,6 @@ export default function viteReact(opts: Options = {}): Plugin[] {
       },
       async handler(code, id, options) {
         const [filepath] = id.split('?')
-        if (!filter(filepath)) return
 
         const ssr = options?.ssr === true
         const babelOptions = (() => {