remove the user's build property of their vite config, because it's a…

… source of conflicts

code/lib/builder-vite/package.json

@@ -65,6 +65,7 @@
   "devDependencies": {
     "@types/express": "^4.17.13",
     "@types/node": "^16.0.0",
+    "ts-dedent": "^2.0.0",
     "typescript": "^4.9.3",
     "vite": "^3.1.3"
   },

code/lib/builder-vite/src/vite-config.ts

@@ -11,6 +11,8 @@ import viteReact from '@vitejs/plugin-react';
 import externalGlobals from 'rollup-plugin-external-globals';
 import { isPreservingSymlinks, getFrameworkName } from '@storybook/core-common';
 import { globals } from '@storybook/preview/globals';
+// eslint-disable-next-line import/no-extraneous-dependencies
+import dedent from 'ts-dedent';
 import {
   codeGeneratorPlugin,
   injectExportOrderPlugin,
@@ -40,7 +42,22 @@ export async function commonConfig(
 ): Promise<ViteInlineConfig> {
   const configEnv = _type === 'development' ? configEnvServe : configEnvBuild;
 
-  const { config: userConfig = {} } = (await loadConfigFromFile(configEnv)) ?? {};
+  // I destructure away the `build` property from the user's config object
+  // I do this because I can contain config that breaks storybook, such as we had in a lit project.
+  // If the user needs to configure the `build` they need to do so in the viteFinal function in main.js.
+  const { config: { build: buildProperty = undefined, ...userConfig } = {} } =
+    (await loadConfigFromFile(configEnv)) ?? {};
+
+  if (buildProperty) {
+    console.warn(
+      dedent`
+        The 'build' property in your vite config is not supported by storybook. Please use the viteFinal function in main.js to configure the build.
+        This is because storybook needs to configure the build for you.
+
+        Often the user's (your) app, needs 'build' config that is different from storybook.
+      `
+    );
+  }
 
   const sbConfig: InlineConfig = {
     configFile: false,