Merge pull request #22501 from storybookjs/build/vite-react-plugin-co…

…nflict

Sandboxes: Pin @vitejs/plugin-react to avoid conflict

scripts/tasks/sandbox-parts.ts

@@ -16,7 +16,12 @@ import { join, resolve, sep } from 'path';
 import slash from 'slash';
 import type { Task } from '../task';
 import { executeCLIStep, steps } from '../utils/cli-step';
-import { installYarn2, configureYarn2ForVerdaccio, addPackageResolutions } from '../utils/yarn';
+import {
+  installYarn2,
+  configureYarn2ForVerdaccio,
+  addPackageResolutions,
+  addWorkaroundResolutions,
+} from '../utils/yarn';
 import { exec } from '../utils/exec';
 import type { ConfigFile } from '../../code/lib/csf-tools';
 import { writeConfig } from '../../code/lib/csf-tools';
@@ -81,6 +86,7 @@ export const install: Task['run'] = async (
       dryRun,
       debug,
     });
+    await addWorkaroundResolutions({ cwd, dryRun, debug });
   } else {
     // We need to add package resolutions to ensure that we only ever install the latest version
     // of any storybook packages as verdaccio is not able to both proxy to npm and publish over

scripts/utils/yarn.ts

@@ -58,6 +58,19 @@ export const installYarn2 = async ({ cwd, dryRun, debug }: YarnOptions) => {
   );
 };
 
+export const addWorkaroundResolutions = async ({ cwd, dryRun }: YarnOptions) => {
+  logger.info(`🔢 Adding resolutions for workarounds`);
+  if (dryRun) return;
+
+  const packageJsonPath = path.join(cwd, 'package.json');
+  const packageJson = await readJSON(packageJsonPath);
+  packageJson.resolutions = {
+    ...packageJson.resolutions,
+    '@vitejs/plugin-react': '^4.0.0', // due to conflicting version in @storybook/vite-react
+  };
+  await writeJSON(packageJsonPath, packageJson, { spaces: 2 });
+};
+
 export const configureYarn2ForVerdaccio = async ({ cwd, dryRun, debug }: YarnOptions) => {
   const command = [
     // We don't want to use the cache or we might get older copies of our built packages