Merge pull request #479 from dev-five-git/fix-storybook-issue

Fix split css issue

Author: owjs3901

.changeset/chatty-dots-bathe.md

@@ -0,0 +1,5 @@
+---
+'@devup-ui/vite-plugin': patch
+---
+
+Fix split css issue

apps/vite-lib/vite.config.ts

@@ -26,7 +26,7 @@ export default defineConfig({
         isolatedModules: false,
         declaration: true,
       },
-    }) as any,
+    }),
   ],
   build: {
     rollupOptions: {

apps/vite/vite.config.ts

@@ -8,7 +8,7 @@ export default defineConfig({
     react(),
     DevupUI({
       include: ['vite-lib-example'],
-      // singleCss: true,
+      singleCss: true,
     }),
   ],
 })

packages/components/vite.config.ts

@@ -29,7 +29,7 @@ export default defineConfig({
         isolatedModules: false,
         declaration: true,
       },
-    }) as any,
+    }),
   ],
   build: {
     rollupOptions: {

packages/eslint-plugin/vite.config.ts

@@ -28,7 +28,7 @@ export default defineConfig({
         isolatedModules: false,
         declaration: true,
       },
-    }) as any,
+    }),
   ],
   build: {
     rollupOptions: {

packages/next-plugin/vite.config.ts

@@ -28,7 +28,7 @@ export default defineConfig({
         isolatedModules: false,
         declaration: true,
       },
-    }) as any,
+    }),
   ],
   build: {
     rollupOptions: {

packages/react/vite.config.ts

@@ -29,7 +29,7 @@ export default defineConfig({
         isolatedModules: false,
         declaration: true,
       },
-    }) as any,
+    }),
   ],
   build: {
     rollupOptions: {

packages/reset-css/vite.config.ts

@@ -29,7 +29,7 @@ export default defineConfig({
         isolatedModules: false,
         declaration: true,
       },
-    }) as any,
+    }),
   ],
   build: {
     rollupOptions: {

packages/rsbuild-plugin/vite.config.ts

@@ -28,7 +28,7 @@ export default defineConfig({
         isolatedModules: false,
         declaration: true,
       },
-    }) as any,
+    }),
   ],
   build: {
     rollupOptions: {

packages/vite-plugin/src/plugin.ts

@@ -120,8 +120,9 @@ export function DevupUI({
             output: {
               manualChunks(id) {
                 // merge devup css files
-                if (id.split('?')[0].endsWith('devup-ui.css')) {
-                  return `devup-ui.css`
+                const fileName = basename(id).split('?')[0]
+                if (/devup-ui(-\d+)?\.css$/.test(fileName)) {
+                  return fileName
                 }
               },
             },
@@ -149,20 +150,24 @@ export function DevupUI({
       }
     },
     resolveId(id, importer) {
+      const fileName = basename(id).split('?')[0]
       if (
-        id.includes('devup-ui.css') &&
+        /devup-ui(-\d+)?\.css$/.test(fileName) &&
         resolve(importer ? join(dirname(importer), id) : id) ===
-          resolve(join(cssDir, 'devup-ui.css'))
+          resolve(join(cssDir, fileName))
       ) {
         return join(
           cssDir,
-          `devup-ui.css?t=${Date.now().toString() + (cssMap.get(null)?.length ?? 0)}`,
+          `${fileName}?t=${
+            Date.now().toString() +
+            (cssMap.get(getFileNumByFilename(fileName))?.length ?? 0)
+          }`,
         )
       }
     },
     load(id) {
       const fileName = basename(id).split('?')[0]
-      if (fileName.startsWith('devup-ui') && fileName.endsWith('.css')) {
+      if (/devup-ui(-\d+)?\.css$/.test(fileName)) {
         const fileNum = getFileNumByFilename(fileName)
         const css = getCss(fileNum, false)
         cssMap.set(fileNum, css)