fix: chromatic builds

launchdarkly · Dec 5, 2023 · e66e7a3 · e66e7a3
1 parent c7a7370
commit e66e7a3
Showing 1 changed file with 14 additions and 0 deletions.
diff --git a/.storybook/main.ts b/.storybook/main.ts
@@ -3,6 +3,7 @@ import type { StorybookConfig } from '@storybook/react-vite';
 import path from 'path';
 import fs from 'fs';
 import fg from 'fast-glob';
+import stylexPlugin from '@stylexjs/rollup-plugin';
 import turbosnap from 'vite-plugin-turbosnap';
 
 import tsconfig from '../tsconfig.json';
@@ -49,6 +50,15 @@ const config: StorybookConfig = {
   async viteFinal(config, { configType }) {
     if (configType === 'PRODUCTION') {
       config.plugins?.push(turbosnap({ rootDir: config.root || process.cwd() }));
+      config.build!.rollupOptions!.plugins = [
+        stylexPlugin({
+          // Required for CSS variable support
+          unstable_moduleResolution: {
+            type: 'commonJS',
+            rootDir: __dirname,
+          },
+        }),
+      ];
     }
 
     return config;
@@ -57,6 +67,10 @@ const config: StorybookConfig = {
     autodocs: true,
     defaultName: 'Docs',
   },
+  previewHead: (head) => `
+    ${head}
+    ${process.env.NODE_ENV === 'production' ? '<link href="./stylex.css" rel="stylesheet" />' : ''}
+  `,
 };
 
 const getPackageStatusEnvVars = () => {