fix(css): empty CSS entry points should generate CSS files, not JS files

packages/vite/src/node/__tests__/plugins/empty-css.spec.ts

@@ -0,0 +1,70 @@
+import { join } from 'node:path'
+import { mkdirSync, readFileSync, rmSync, writeFileSync } from 'node:fs'
+import { describe, expect, test } from 'vitest'
+
+const testDir = join(__dirname, '../__test-temp-empty-css')
+
+describe('empty CSS entry fix', () => {
+  test('empty CSS entries should generate CSS files, not JS files', async () => {
+    // Setup test directory
+    try {
+      rmSync(testDir, { recursive: true, force: true })
+    } catch {}
+    mkdirSync(testDir, { recursive: true })
+
+    // Create test files
+    writeFileSync(join(testDir, 'empty.css'), '/* comment only */')
+    writeFileSync(join(testDir, 'completely-empty.css'), '')
+    writeFileSync(join(testDir, 'valid.css'), '.test { color: red; }')
+
+    // Create package.json
+    writeFileSync(
+      join(testDir, 'package.json'),
+      JSON.stringify({
+        name: 'test-empty-css',
+        type: 'module',
+      }),
+    )
+
+    // Build with Vite
+    const { build } = await import('vite')
+    await build({
+      configFile: false,
+      root: testDir,
+      logLevel: 'error',
+      build: {
+        manifest: true,
+        rollupOptions: {
+          input: [
+            join(testDir, 'empty.css'),
+            join(testDir, 'completely-empty.css'),
+            join(testDir, 'valid.css'),
+          ],
+        },
+      },
+    })
+
+    // Check manifest
+    const manifestPath = join(testDir, 'dist/.vite/manifest.json')
+    const manifest = JSON.parse(readFileSync(manifestPath, 'utf-8'))
+
+    // All CSS entries should generate CSS files, not JS files
+    for (const [key, entry] of Object.entries(manifest)) {
+      if (key.endsWith('.css')) {
+        expect(
+          (entry as any).file,
+          `${key} should generate .css file, not .js`,
+        ).toMatch(/\.css$/)
+        expect(
+          (entry as any).file,
+          `${key} should not generate .js file`,
+        ).not.toMatch(/\.js$/)
+      }
+    }
+
+    // Cleanup
+    try {
+      rmSync(testDir, { recursive: true, force: true })
+    } catch {}
+  })
+})

packages/vite/src/node/plugins/css.ts

@@ -824,7 +824,7 @@ export function cssPostPlugin(config: ResolvedConfig): Plugin {
         }
       }
 
-      if (chunkCSS) {
+      if (chunkCSS || (isPureCssChunk && chunk.isEntry)) {
         if (isPureCssChunk && (opts.format === 'es' || opts.format === 'cjs')) {
           // this is a shared CSS-only chunk that is empty.
           pureCssChunks.add(chunk)

playground/css/empty.css

@@ -0,0 +1 @@
+/* This is an empty CSS file for testing empty CSS entries */

playground/css/vite.config-empty-css.js

@@ -0,0 +1,15 @@
+import path from 'node:path'
+import { defineConfig } from 'vite'
+
+export default defineConfig({
+  build: {
+    manifest: true,
+    cssCodeSplit: true, // Ensure CSS code splitting
+    rollupOptions: {
+      input: [
+        'empty.css', // Empty CSS file with comments
+        'empty2.css', // Completely empty CSS file
+      ],
+    },
+  },
+})