test(css): deterministic css emit with the same file basename (#12773)

playground/css/__tests__/same-file-name/same-file-name.spec.ts

@@ -0,0 +1,19 @@
+import { beforeEach, describe, expect, test } from 'vitest'
+import { findAssetFile, isBuild, startDefaultServe } from '~utils'
+
+beforeEach(async () => {
+  await startDefaultServe()
+})
+
+for (let i = 0; i < 5; i++) {
+  describe.runIf(isBuild)('css files has same basename', () => {
+    test('emit file name should consistent', () => {
+      expect(findAssetFile('sub.css', 'same-file-name', '.')).toMatch(
+        '.sub1-sub',
+      )
+      expect(findAssetFile('sub2.css', 'same-file-name', '.')).toMatch(
+        '.sub2-sub',
+      )
+    })
+  })
+}

playground/css/__tests__/same-file-name/vite.config.js

@@ -0,0 +1,2 @@
+import config from '../../vite.config-same-file-name'
+export default config

playground/css/main.js

@@ -117,3 +117,6 @@ document
 import './unsupported.css'
 
 import './async/index'
+
+import('./same-name/sub1/sub')
+import('./same-name/sub2/sub')

playground/css/same-name/sub1/sub.css

@@ -0,0 +1,3 @@
+.sub1-sub {
+  color: red;
+}

playground/css/same-name/sub1/sub.js

@@ -0,0 +1,3 @@
+import './sub.css'
+
+export default 'sub1-name'

playground/css/same-name/sub2/sub.css

@@ -0,0 +1,3 @@
+.sub2-sub {
+  color: blue;
+}

playground/css/same-name/sub2/sub.js

@@ -0,0 +1,3 @@
+import './sub.css'
+
+export default 'sub2-name'

playground/css/vite.config-same-file-name.js

@@ -0,0 +1,17 @@
+import { defineConfig } from 'vite'
+import baseConfig from './vite.config.js'
+
+export default defineConfig({
+  ...baseConfig,
+  build: {
+    ...baseConfig.build,
+    outDir: 'dist/same-file-name',
+    rollupOptions: {
+      output: {
+        entryFileNames: '[name].js',
+        chunkFileNames: '[name].[hash].js',
+        assetFileNames: '[name].[ext]',
+      },
+    },
+  },
+})