fix(css): use unique key for cssEntriesMap to prevent same-basename collision

packages/vite/src/node/__tests__/build.spec.ts

@@ -144,6 +144,33 @@ describe('build', () => {
     assertOutputHashContentChange(result[0], result[1])
   })
 
+  test('css entries with the same basename should not cross-link manifest assets', async () => {
+    const root = resolve(dirname, 'fixtures/css-entry-same-basename')
+    const result = (await build({
+      root,
+      logLevel: 'silent',
+      build: {
+        write: false,
+        manifest: true,
+        assetsInlineLimit: 0,
+        rollupOptions: {
+          input: [resolve(root, 'a/index.css'), resolve(root, 'b/index.css')],
+        },
+      },
+    })) as RolldownOutput
+
+    const manifest = JSON.parse(
+      (result.output.find((o) => o.fileName === '.vite/manifest.json') as any)
+        .source,
+    )
+    expect(manifest['a/index.css']).toMatchObject({
+      isEntry: true,
+    })
+    expect(manifest['b/index.css']).toMatchObject({
+      isEntry: true,
+    })
+  })
+
   test.for([
     [true, true],
     [true, false],

packages/vite/src/node/__tests__/fixtures/css-entry-same-basename/a/index.css

@@ -0,0 +1,3 @@
+.entry-a {
+  background-color: red;
+}

packages/vite/src/node/__tests__/fixtures/css-entry-same-basename/b/index.css

@@ -0,0 +1,3 @@
+.entry-b {
+  background-color: blue;
+}

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

@@ -56,7 +56,7 @@ const assetCache = new WeakMap<Environment, Map<string, string>>()
 /** a set of referenceId for entry CSS assets for each environment */
 export const cssEntriesMap: WeakMap<
   Environment,
-  Map<string, string>
+  Map<string, { referenceId: string; name: string }>
 > = new WeakMap()
 
 // add own dictionary entry by directly assigning mrmime

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

@@ -914,7 +914,7 @@ export function cssPostPlugin(config: ResolvedConfig): Plugin {
                   if (isEntry) {
                     cssEntriesMap
                       .get(this.environment)!
-                      .set(chunk.name, referenceId)
+                      .set(chunk.fileName, { referenceId, name: chunk.name })
                   }
                   chunk.viteMetadata!.importedCss.add(
                     this.getFileName(referenceId),
@@ -1103,13 +1103,13 @@ export function cssPostPlugin(config: ResolvedConfig): Plugin {
 
         const removedPureCssFiles = removedPureCssFilesCache.get(config)!
         pureCssChunkNames.forEach((fileName) => {
-          const emptyJsPlaceholder = bundle[fileName] as RenderedChunk
+          const emptyJsPlaceholder = bundle[fileName] as OutputChunk
           if (emptyJsPlaceholder.isEntry) {
             const { importedAssets, importedCss } =
               emptyJsPlaceholder.viteMetadata!
             const cssReferenceId = cssEntriesMap
               .get(this.environment)!
-              .get(emptyJsPlaceholder.name)!
+              .get(emptyJsPlaceholder.preliminaryFileName)!.referenceId
             const realCssEntryName = this.getFileName(cssReferenceId)
             const realCssEntry = bundle[realCssEntryName]!
             importedCss.delete(realCssEntryName)

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

@@ -100,7 +100,11 @@ export function manifestPlugin(): Plugin {
           environment.config.isOutputOptionsForLegacyChunks,
         cssEntries() {
           return Object.fromEntries(
-            cssEntriesMap.get(envs[environment.name])!.entries(),
+            [...cssEntriesMap.get(envs[environment.name])!.values()].map(
+              ({ name, referenceId }) => {
+                return [referenceId, name]
+              },
+            ),
           )
         },
       }),