storybook ok

packages/atomic/.storybook/main.mts

@@ -1,6 +1,10 @@
 import {nxViteTsPaths} from '@nx/vite/plugins/nx-tsconfig-paths.plugin';
 import type {StorybookConfig} from '@storybook/web-components-vite';
+import path from 'node:path';
 import {mergeConfig} from 'vite';
+import headlessJson from '../../../packages/headless/package.json';
+
+const isCDN = process.env.DEPLOYMENT_ENVIRONMENT === 'CDN' || true;
 
 const config: StorybookConfig = {
   stories: ['../src/**/*.new.stories.@(js|jsx|ts|tsx|mdx)'],
@@ -16,12 +20,89 @@ const config: StorybookConfig = {
     options: {},
   },
 
-  viteFinal: async (config) =>
+  viteFinal: async (config, {configType}) =>
     mergeConfig(config, {
-      plugins: [nxViteTsPaths()],
+      plugins: [
+        nxViteTsPaths(),
+        configType === 'PRODUCTION' && externalizeDependencies(),
+      ],
     }),
 };
 
+function externalizeDependencies() {
+  return {
+    name: 'externalize-dependencies',
+    enforce: 'pre',
+    resolveId: (id: string) => {
+      if (id.startsWith('/headless')) {
+        return false;
+      }
+      if (packageMappings[id]) {
+        if (!isCDN) {
+          return false;
+        }
+
+        return {
+          id: packageMappings[id].cdn,
+          external: 'absolute',
+        };
+      }
+    },
+  };
+}
+
+let headlessVersion: string;
+if (isCDN) {
+  console.log('Building for CDN');
+  headlessVersion = 'v' + headlessJson.version;
+}
+
+const packageMappings: {[key: string]: {devWatch: string; cdn: string}} = {
+  '@coveo/headless/commerce': {
+    devWatch: path.resolve(
+      __dirname,
+      '../src/external-builds/commerce/headless.esm.js'
+    ),
+    cdn: `/headless/${headlessVersion}/commerce/headless.esm.js`,
+  },
+  '@coveo/headless/insight': {
+    devWatch: path.resolve(
+      __dirname,
+      '../src/external-builds/insight/headless.esm.js'
+    ),
+    cdn: `/headless/${headlessVersion}/insight/headless.esm.js`,
+  },
+  '@coveo/headless/product-recommendation': {
+    devWatch: path.resolve(
+      __dirname,
+      '../src/external-builds/product-recommendation/headless.esm.js'
+    ),
+    cdn: `/headless/${headlessVersion}/product-recommendation/headless.esm.js`,
+  },
+  '@coveo/headless/recommendation': {
+    devWatch: path.resolve(
+      __dirname,
+      '../src/external-builds/recommendation/headless.esm.js'
+    ),
+    cdn: `/headless/${headlessVersion}/recommendation/headless.esm.js`,
+  },
+  '@coveo/headless/case-assist': {
+    devWatch: path.resolve(
+      __dirname,
+      '../src/external-builds/case-assist/headless.esm.js'
+    ),
+    cdn: `/headless/${headlessVersion}/case-assist/headless.esm.js`,
+  },
+  '@coveo/headless': {
+    devWatch: path.resolve(__dirname, '../src/external-builds/headless.esm.js'),
+    cdn: `/headless/${headlessVersion}/headless.esm.js`,
+  },
+  /*   '@coveo/bueno': {
+    devWatch: path.resolve(__dirname, './src/external-builds/bueno.esm.js'),
+    cdn: `/bueno/${headlessVersion}/bueno.esm.js`,
+  }, */
+};
+
 export default config;
 
 // To customize your Vite configuration you can use the viteFinal field.