From ca807e52cf8376994b312a6a10606931c5244f39 Mon Sep 17 00:00:00 2001
From: owjs3901 <owjs3901@naver.com>
Date: Thu, 20 Feb 2025 15:43:38 +0900
Subject: [PATCH] Support storybook

---
 .changeset/brown-schools-jam.md                   | 5 +++++
 packages/vite-plugin/src/__tests__/plugin.test.ts | 9 +++------
 packages/vite-plugin/src/plugin.ts                | 5 ++++-
 3 files changed, 12 insertions(+), 7 deletions(-)
 create mode 100644 .changeset/brown-schools-jam.md

diff --git a/.changeset/brown-schools-jam.md b/.changeset/brown-schools-jam.md
new file mode 100644
index 00000000..e8f1bb0e
--- /dev/null
+++ b/.changeset/brown-schools-jam.md
@@ -0,0 +1,5 @@
+---
+"@devup-ui/vite-plugin": patch
+---
+
+Support storybook
diff --git a/packages/vite-plugin/src/__tests__/plugin.test.ts b/packages/vite-plugin/src/__tests__/plugin.test.ts
index 9517e2ca..08c9ae23 100644
--- a/packages/vite-plugin/src/__tests__/plugin.test.ts
+++ b/packages/vite-plugin/src/__tests__/plugin.test.ts
@@ -3,7 +3,7 @@ import { writeFile } from 'node:fs/promises'
 import { dirname, join, resolve } from 'node:path'
 import { fileURLToPath } from 'node:url'
 
-import { codeExtract, getThemeInterface } from '@devup-ui/wasm'
+import { codeExtract, getCss, getThemeInterface } from '@devup-ui/wasm'
 import { describe } from 'vitest'
 
 import { DevupUI } from '../plugin'
@@ -344,13 +344,10 @@ describe('devupUIPlugin', () => {
       Date.now = () => 1
       expect((plugin as any).load('code')).toBeUndefined()
       expect((plugin as any).load(cssFile)).toBeUndefined()
+      vi.mocked(getCss).mockReturnValueOnce('css code')
       expect(
         (plugin as any).load('devup-ui.css?v=some').length.toString(),
-      ).toBe(
-        (plugin as any)
-          .resolveId(cssFile, 'code')
-          .substring(`devup-ui.css?v=${Date.now()}`.length),
-      )
+      ).toBe('css code'.length.toString())
     })
   })
 })
diff --git a/packages/vite-plugin/src/plugin.ts b/packages/vite-plugin/src/plugin.ts
index e6ff5407..6724e234 100644
--- a/packages/vite-plugin/src/plugin.ts
+++ b/packages/vite-plugin/src/plugin.ts
@@ -4,6 +4,7 @@ import { join, resolve } from 'node:path'
 
 import {
   codeExtract,
+  getCss,
   getThemeInterface,
   registerTheme,
   setDebug,
@@ -115,7 +116,9 @@ export function DevupUI({
         return `devup-ui.css?t=${Date.now().toString() + globalCss.length}`
     },
     load(id) {
-      if (id.split('?')[0] === 'devup-ui.css') return globalCss
+      if (id.split('?')[0] === 'devup-ui.css')
+        // for no share env like storybook
+        return (globalCss = getCss())
     },
     enforce: 'pre',
     async transform(code, id) {