diff --git a/code/frameworks/react-vite/package.json b/code/frameworks/react-vite/package.json
index ece8f749b918..7aa3ec053562 100644
--- a/code/frameworks/react-vite/package.json
+++ b/code/frameworks/react-vite/package.json
@@ -60,7 +60,7 @@
     "@storybook/client-api": "7.0.0-alpha.34",
     "@storybook/preview-web": "7.0.0-alpha.34",
     "@storybook/react": "7.0.0-alpha.34",
-    "@vitejs/plugin-react": "^2.0.1",
+    "@vitejs/plugin-react": "^2.0.0",
     "ast-types": "^0.14.2",
     "magic-string": "^0.26.1",
     "react-docgen": "^6.0.0-alpha.3",
diff --git a/code/frameworks/react-vite/src/preset.ts b/code/frameworks/react-vite/src/preset.ts
index 5eae98e6c54f..2afd4bed0a62 100644
--- a/code/frameworks/react-vite/src/preset.ts
+++ b/code/frameworks/react-vite/src/preset.ts
@@ -1,7 +1,6 @@
 /* eslint-disable global-require */
-import path from 'path';
-import fs from 'fs';
 import type { StorybookConfig, TypescriptOptions } from '@storybook/builder-vite';
+import { hasPlugin, readPackageJson } from './utils';
 
 export const addons: StorybookConfig['addons'] = ['@storybook/react'];
 
@@ -9,25 +8,21 @@ export const core: StorybookConfig['core'] = {
   builder: '@storybook/builder-vite',
 };
 
-function readPackageJson(): Record<string, any> | false {
-  const packageJsonPath = path.resolve('package.json');
-  if (!fs.existsSync(packageJsonPath)) {
-    return false;
-  }
-
-  const jsonContent = fs.readFileSync(packageJsonPath, 'utf8');
-  return JSON.parse(jsonContent);
-}
-
 export const viteFinal: StorybookConfig['viteFinal'] = async (config, { presets }) => {
   const { plugins = [] } = config;
 
+  // Add react plugin if not present
+  if (!hasPlugin(plugins, 'vite:react-babel')) {
+    const { default: react } = await import('@vitejs/plugin-react');
+    plugins.push(react());
+  }
+
+  // Add docgen plugin
   const { reactDocgen, reactDocgenTypescriptOptions } = await presets.apply<any>(
     'typescript',
     {} as TypescriptOptions
   );
   let typescriptPresent;
-
   try {
     const pkgJson = readPackageJson();
     typescriptPresent =
@@ -35,7 +30,6 @@ export const viteFinal: StorybookConfig['viteFinal'] = async (config, { presets
   } catch (e) {
     typescriptPresent = false;
   }
-
   if (reactDocgen === 'react-docgen-typescript' && typescriptPresent) {
     plugins.push(
       require('@joshwooding/vite-plugin-react-docgen-typescript')(reactDocgenTypescriptOptions)
diff --git a/code/frameworks/react-vite/src/utils.ts b/code/frameworks/react-vite/src/utils.ts
new file mode 100644
index 000000000000..851197ad177e
--- /dev/null
+++ b/code/frameworks/react-vite/src/utils.ts
@@ -0,0 +1,28 @@
+import path from 'path';
+import fs from 'fs';
+import { PluginOption } from 'vite';
+
+export function readPackageJson(): Record<string, any> | false {
+  const packageJsonPath = path.resolve('package.json');
+  if (!fs.existsSync(packageJsonPath)) {
+    return false;
+  }
+
+  const jsonContent = fs.readFileSync(packageJsonPath, 'utf8');
+  return JSON.parse(jsonContent);
+}
+
+function checkName(plugin: PluginOption, name: string) {
+  return typeof plugin === 'object' && 'name' in plugin && plugin.name === name;
+}
+
+export function hasPlugin(plugins: PluginOption[], name: string) {
+  return Boolean(
+    plugins.find((p): boolean => {
+      if (Array.isArray(p)) {
+        return Boolean(hasPlugin(p, name));
+      }
+      return checkName(p, name);
+    })
+  );
+}
diff --git a/code/frameworks/svelte-vite/src/preset.ts b/code/frameworks/svelte-vite/src/preset.ts
index 8c0387342d33..b30ad376a94e 100644
--- a/code/frameworks/svelte-vite/src/preset.ts
+++ b/code/frameworks/svelte-vite/src/preset.ts
@@ -1,4 +1,5 @@
 import type { StorybookConfig } from '@storybook/builder-vite';
+import { hasPlugin } from './utils';
 import { svelteDocgen } from './plugins/svelte-docgen';
 
 export const addons: StorybookConfig['addons'] = ['@storybook/svelte'];
@@ -10,6 +11,13 @@ export const core: StorybookConfig['core'] = {
 export const viteFinal: StorybookConfig['viteFinal'] = async (config, { presets }) => {
   const { plugins = [] } = config;
 
+  // Add svelte plugin if not present
+  if (!hasPlugin(plugins, 'vite-plugin-svelte')) {
+    const { svelte } = await import('@sveltejs/vite-plugin-svelte');
+    plugins.push(svelte());
+  }
+
+  // Add docgen plugin
   plugins.push(svelteDocgen(config));
 
   return {
diff --git a/code/frameworks/svelte-vite/src/utils.ts b/code/frameworks/svelte-vite/src/utils.ts
new file mode 100644
index 000000000000..d6ce9c6bea8f
--- /dev/null
+++ b/code/frameworks/svelte-vite/src/utils.ts
@@ -0,0 +1,16 @@
+import { PluginOption } from 'vite';
+
+function checkName(plugin: PluginOption, name: string) {
+  return typeof plugin === 'object' && 'name' in plugin && plugin.name === name;
+}
+
+export function hasPlugin(plugins: PluginOption[], name: string) {
+  return Boolean(
+    plugins.find((p): boolean => {
+      if (Array.isArray(p)) {
+        return Boolean(hasPlugin(p, name));
+      }
+      return checkName(p, name);
+    })
+  );
+}
diff --git a/code/frameworks/vue3-vite/package.json b/code/frameworks/vue3-vite/package.json
index 5341df7086c8..c971363dc739 100644
--- a/code/frameworks/vue3-vite/package.json
+++ b/code/frameworks/vue3-vite/package.json
@@ -59,7 +59,7 @@
     "@storybook/core-server": "7.0.0-alpha.34",
     "@storybook/preview-web": "7.0.0-alpha.34",
     "@storybook/vue3": "7.0.0-alpha.34",
-    "@vitejs/plugin-vue": "^3.0.3",
+    "@vitejs/plugin-vue": "^3.0.0",
     "magic-string": "^0.26.1",
     "vite": "^3.1.3",
     "vue-docgen-api": "^4.40.0"
diff --git a/code/frameworks/vue3-vite/src/preset.ts b/code/frameworks/vue3-vite/src/preset.ts
index 3f35bed8b1ce..fae1204c016c 100644
--- a/code/frameworks/vue3-vite/src/preset.ts
+++ b/code/frameworks/vue3-vite/src/preset.ts
@@ -1,7 +1,6 @@
-import path from 'path';
-import fs from 'fs';
 import type { StorybookConfig } from '@storybook/builder-vite';
 import { vueDocgen } from './plugins/vue-docgen';
+import { hasPlugin } from './utils';
 
 export const addons: StorybookConfig['addons'] = ['@storybook/vue3'];
 
@@ -9,19 +8,16 @@ export const core: StorybookConfig['core'] = {
   builder: '@storybook/builder-vite',
 };
 
-export function readPackageJson(): Record<string, any> | false {
-  const packageJsonPath = path.resolve('package.json');
-  if (!fs.existsSync(packageJsonPath)) {
-    return false;
-  }
-
-  const jsonContent = fs.readFileSync(packageJsonPath, 'utf8');
-  return JSON.parse(jsonContent);
-}
-
 export const viteFinal: StorybookConfig['viteFinal'] = async (config, { presets }) => {
   const { plugins = [] } = config;
 
+  // Add vue plugin if not present
+  if (!hasPlugin(plugins, 'vite:vue')) {
+    const { default: vue } = await import('@vitejs/plugin-vue');
+    plugins.push(vue());
+  }
+
+  // Add docgen plugin
   plugins.push(vueDocgen());
 
   const updated = {
diff --git a/code/frameworks/vue3-vite/src/utils.ts b/code/frameworks/vue3-vite/src/utils.ts
new file mode 100644
index 000000000000..d6ce9c6bea8f
--- /dev/null
+++ b/code/frameworks/vue3-vite/src/utils.ts
@@ -0,0 +1,16 @@
+import { PluginOption } from 'vite';
+
+function checkName(plugin: PluginOption, name: string) {
+  return typeof plugin === 'object' && 'name' in plugin && plugin.name === name;
+}
+
+export function hasPlugin(plugins: PluginOption[], name: string) {
+  return Boolean(
+    plugins.find((p): boolean => {
+      if (Array.isArray(p)) {
+        return Boolean(hasPlugin(p, name));
+      }
+      return checkName(p, name);
+    })
+  );
+}
diff --git a/code/yarn.lock b/code/yarn.lock
index 6449f6e663bb..23cbece1fb92 100644
--- a/code/yarn.lock
+++ b/code/yarn.lock
@@ -8486,7 +8486,7 @@ __metadata:
     "@storybook/preview-web": 7.0.0-alpha.34
     "@storybook/react": 7.0.0-alpha.34
     "@types/node": ^14.14.20 || ^16.0.0
-    "@vitejs/plugin-react": ^2.0.1
+    "@vitejs/plugin-react": ^2.0.0
     ast-types: ^0.14.2
     magic-string: ^0.26.1
     react-docgen: ^6.0.0-alpha.3
@@ -9182,7 +9182,7 @@ __metadata:
     "@storybook/preview-web": 7.0.0-alpha.34
     "@storybook/vue3": 7.0.0-alpha.34
     "@types/node": ^14.14.20 || ^16.0.0
-    "@vitejs/plugin-vue": ^3.0.3
+    "@vitejs/plugin-vue": ^3.0.0
     magic-string: ^0.26.1
     typescript: ~4.6.3
     vite: ^3.1.3
@@ -11013,7 +11013,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@vitejs/plugin-react@npm:^2.0.0, @vitejs/plugin-react@npm:^2.0.1":
+"@vitejs/plugin-react@npm:^2.0.0":
   version: 2.1.0
   resolution: "@vitejs/plugin-react@npm:2.1.0"
   dependencies:
@@ -11030,7 +11030,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@vitejs/plugin-vue@npm:^3.0.3":
+"@vitejs/plugin-vue@npm:^3.0.0":
   version: 3.1.0
   resolution: "@vitejs/plugin-vue@npm:3.1.0"
   peerDependencies:
@@ -11040,6 +11040,16 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@vitejs/plugin-vue@npm:^3.0.3":
+  version: 3.1.2
+  resolution: "@vitejs/plugin-vue@npm:3.1.2"
+  peerDependencies:
+    vite: ^3.0.0
+    vue: ^3.2.25
+  checksum: 53867c9367f1133305e858541a9094a44c5e60d82d0c68d5eb41194dcac01ecd273252786046b3e523d40112374ac7f47558f7b292394a4529355d64b82c04cf
+  languageName: node
+  linkType: hard
+
 "@vue/babel-helper-vue-jsx-merge-props@npm:^1.4.0":
   version: 1.4.0
   resolution: "@vue/babel-helper-vue-jsx-merge-props@npm:1.4.0"