chore(deps): bump @vitejs/plugin-react from 4.7.0 to 5.2.0

.changeset/swift-ferrets-climb.md

@@ -0,0 +1,7 @@
+---
+"@strapi/sdk-plugin": patch
+---
+
+chore(deps): bump @vitejs/plugin-react from 4.7.0 to 5.2.0
+
+fix: resolve ESM default exports for `@vitejs/plugin-react` and dynamic `import()` usage so admin plugin builds and unit tests load the React Vite plugin correctly

package.json

@@ -59,7 +59,7 @@
   },
   "dependencies": {
     "@types/prompts": "2.4.9",
-    "@vitejs/plugin-react": "^4.7.0",
+    "@vitejs/plugin-react": "^5.2.0",
     "boxen": "8.0.1",
     "chalk": "4.1.2",
     "commander": "14.0.3",

src/__tests__/e2e/build.test.ts

@@ -1,9 +1,6 @@
 import fs from 'node:fs';
 import path from 'node:path';
 
-import { build } from '../../cli/commands/utils/build';
-import { createLogger } from '../../cli/commands/utils/logger';
-
 import { getFixturePath, invokeCLI, withMockedCLI } from './test-utils';
 
 describe('build command', () => {
@@ -70,6 +67,8 @@ describe('build command', () => {
     });
 
     it('should build custom exports defined in package.json', async () => {
+      const { build } = await import('../../cli/commands/utils/build');
+      const { createLogger } = await import('../../cli/commands/utils/logger');
       const logger = createLogger({ silent: true, debug: false, timestamp: false });
 
       await build({
@@ -83,6 +82,8 @@ describe('build command', () => {
     });
 
     it('should build ESM-only custom export when only import is specified', async () => {
+      const { build } = await import('../../cli/commands/utils/build');
+      const { createLogger } = await import('../../cli/commands/utils/logger');
       const logger = createLogger({ silent: true, debug: false, timestamp: false });
 
       await build({
@@ -98,6 +99,8 @@ describe('build command', () => {
     });
 
     it('should generate type declarations for custom exports with types field', async () => {
+      const { build } = await import('../../cli/commands/utils/build');
+      const { createLogger } = await import('../../cli/commands/utils/logger');
       const logger = createLogger({ silent: true, debug: false, timestamp: false });
 
       await build({

src/cli/commands/utils/build/index.ts

@@ -3,7 +3,6 @@
  */
 import fs from 'node:fs';
 import path from 'node:path';
-import { build as viteBuild } from 'vite';
 
 import { createViteConfig } from './vite-config';
 
@@ -111,6 +110,7 @@ export async function build(options: BuildOptions): Promise<void> {
       silent,
     });
 
+    const { build: viteBuild } = await import('vite');
     await viteBuild(config);
 
     if (!silent) {

src/cli/commands/utils/build/react-plugin-loader.ts

@@ -0,0 +1,14 @@
+import { importEsm, resolveDefaultExport } from '../esm-interop';
+
+import type { Plugin } from 'vite';
+
+type ReactPluginFactory = (options?: unknown) => Plugin | Plugin[];
+
+export const loadReactPlugins = async (): Promise<Plugin[]> => {
+  const mod = await importEsm('@vitejs/plugin-react');
+  const reactPlugin = resolveDefaultExport<ReactPluginFactory>(mod);
+  const result = reactPlugin();
+  const plugins = Array.isArray(result) ? result : [result];
+
+  return plugins.filter(Boolean) as Plugin[];
+};

src/cli/commands/utils/build/vite-config.ts

@@ -2,8 +2,13 @@ import fs from 'node:fs';
 import { builtinModules } from 'node:module';
 import path from 'node:path';
 
+import { resolveDefaultExport } from '../esm-interop';
+
+import { loadReactPlugins } from './react-plugin-loader';
+
 import type { BundleConfig } from './index';
 import type { InlineConfig, Plugin } from 'vite';
+import type dtsPlugin from 'vite-plugin-dts';
 
 export interface ViteConfigOptions {
   cwd: string;
@@ -90,15 +95,10 @@ export async function createViteConfig(options: ViteConfigOptions): Promise<Inli
 
   // Add React plugin for admin builds
   if (isAdmin) {
-    // Dynamically import to avoid loading React plugin for server builds
-    const { default: reactPlugin } = await import('@vitejs/plugin-react');
-    const reactPluginResult = reactPlugin();
-    const reactPlugins = Array.isArray(reactPluginResult) ? reactPluginResult : [reactPluginResult];
+    const reactPlugins = await loadReactPlugins();
 
     for (const plugin of reactPlugins) {
-      if (plugin) {
-        plugins.unshift(plugin as Plugin);
-      }
+      plugins.unshift(plugin);
     }
   }
 
@@ -141,7 +141,8 @@ export async function createViteConfig(options: ViteConfigOptions): Promise<Inli
     }
 
     if (tsconfigPath) {
-      const { default: dts } = await import('vite-plugin-dts');
+      const dtsMod = await import('vite-plugin-dts');
+      const dts = resolveDefaultExport<typeof dtsPlugin>(dtsMod);
 
       // Output types to the correct location
       // Expected: dist/admin/src/index.d.ts or dist/server/src/index.d.ts