refactor: use originalFileNames/names (#18240)

Author: sapphi-red

package.json

@@ -69,7 +69,7 @@
     "playwright-chromium": "^1.48.1",
     "prettier": "3.3.3",
     "rimraf": "^5.0.10",
-    "rollup": "^4.22.5",
+    "rollup": "^4.23.0",
     "rollup-plugin-esbuild": "^6.1.1",
     "simple-git-hooks": "^2.11.1",
     "tslib": "^2.8.0",

packages/vite/package.json

@@ -87,7 +87,7 @@
   "dependencies": {
     "esbuild": "^0.24.0",
     "postcss": "^8.4.47",
-    "rollup": "^4.22.5"
+    "rollup": "^4.23.0"
   },
   "optionalDependencies": {
     "fsevents": "~2.3.3"

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

@@ -38,17 +38,8 @@ const jsSourceMapRE = /\.[cm]?js\.map$/
 
 const assetCache = new WeakMap<Environment, Map<string, string>>()
 
-// chunk.name is the basename for the asset ignoring the directory structure
-// For the manifest, we need to preserve the original file path and isEntry
-// for CSS assets. We keep a map from referenceId to this information.
-export interface GeneratedAssetMeta {
-  originalFileName: string
-  isEntry?: boolean
-}
-export const generatedAssetsMap = new WeakMap<
-  Environment,
-  Map<string, GeneratedAssetMeta>
->()
+/** a set of referenceId for entry CSS assets for each environment */
+export const cssEntriesMap = new WeakMap<Environment, Set<string>>()
 
 // add own dictionary entry by directly assigning mrmime
 export function registerCustomMime(): void {
@@ -146,7 +137,7 @@ export function assetPlugin(config: ResolvedConfig): Plugin {
 
     buildStart() {
       assetCache.set(this.environment, new Map())
-      generatedAssetsMap.set(this.environment, new Map())
+      cssEntriesMap.set(this.environment, new Set())
     },
 
     resolveId(id) {
@@ -384,8 +375,6 @@ async function fileToBuiltUrl(
       originalFileName,
       source: content,
     })
-    generatedAssetsMap.get(environment)!.set(referenceId, { originalFileName })
-
     url = `__VITE_ASSET__${referenceId}__${postfix ? `$_${postfix}__` : ``}`
   }
 

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

@@ -83,9 +83,9 @@ import type { DevEnvironment } from '..'
 import { addToHTMLProxyTransformResult } from './html'
 import {
   assetUrlRE,
+  cssEntriesMap,
   fileToDevUrl,
   fileToUrl,
-  generatedAssetsMap,
   publicAssetUrlCache,
   publicAssetUrlRE,
   publicFileToBuiltUrl,
@@ -447,7 +447,9 @@ export function cssPostPlugin(config: ResolvedConfig): Plugin {
         assetFileNames({
           type: 'asset',
           name: cssAssetName,
+          names: [cssAssetName],
           originalFileName: null,
+          originalFileNames: [],
           source: '/* vite internal call, ignore */',
         }),
       )
@@ -576,8 +578,6 @@ export function cssPostPlugin(config: ResolvedConfig): Plugin {
     },
 
     async renderChunk(code, chunk, opts) {
-      const generatedAssets = generatedAssetsMap.get(this.environment)!
-
       let chunkCSS = ''
       // the chunk is empty if it's a dynamic entry chunk that only contains a CSS import
       const isJsChunkEmpty = code === '' && !chunk.isEntry
@@ -736,7 +736,6 @@ export function cssPostPlugin(config: ResolvedConfig): Plugin {
             originalFileName,
             source: content,
           })
-          generatedAssets.set(referenceId, { originalFileName })
 
           const filename = this.getFileName(referenceId)
           chunk.viteMetadata!.importedAssets.add(cleanUrl(filename))
@@ -794,7 +793,9 @@ export function cssPostPlugin(config: ResolvedConfig): Plugin {
               originalFileName,
               source: chunkCSS,
             })
-            generatedAssets.set(referenceId, { originalFileName, isEntry })
+            if (isEntry) {
+              cssEntriesMap.get(this.environment)!.add(referenceId)
+            }
             chunk.viteMetadata!.importedCss.add(this.getFileName(referenceId))
           } else if (this.environment.config.consumer === 'client') {
             // legacy build and inline css

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

@@ -869,7 +869,8 @@ export function buildHtmlPlugin(config: ResolvedConfig): Plugin {
         // inject css link when cssCodeSplit is false
         if (!this.environment.config.build.cssCodeSplit) {
           const cssChunk = Object.values(bundle).find(
-            (chunk) => chunk.type === 'asset' && chunk.name === 'style.css',
+            (chunk) =>
+              chunk.type === 'asset' && chunk.names.includes('style.css'),
           ) as OutputAsset | undefined
           if (cssChunk) {
             result = injectToHead(result, [

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

@@ -8,7 +8,7 @@ import type {
 import type { Plugin } from '../plugin'
 import { normalizePath, sortObjectKeys } from '../utils'
 import { usePerEnvironmentState } from '../environment'
-import { generatedAssetsMap } from './asset'
+import { cssEntriesMap } from './asset'
 
 const endsWithJSRE = /\.[cm]?js$/
 
@@ -127,18 +127,15 @@ export function manifestPlugin(): Plugin {
         return manifestChunk
       }
 
-      const assets = generatedAssetsMap.get(this.environment)!
-      const entryCssAssetFileNames = new Set()
-      for (const [id, asset] of assets.entries()) {
-        if (asset.isEntry) {
-          try {
-            const fileName = this.getFileName(id)
-            entryCssAssetFileNames.add(fileName)
-          } catch {
-            // The asset was generated as part of a different output option.
-            // It was already handled during the previous run of this plugin.
-            assets.delete(id)
-          }
+      const entryCssReferenceIds = cssEntriesMap.get(this.environment)!
+      const entryCssAssetFileNames = new Set(entryCssReferenceIds)
+      for (const id of entryCssReferenceIds) {
+        try {
+          const fileName = this.getFileName(id)
+          entryCssAssetFileNames.add(fileName)
+        } catch {
+          // The asset was generated as part of a different output option.
+          // It was already handled during the previous run of this plugin.
         }
       }
 
@@ -148,28 +145,24 @@ export function manifestPlugin(): Plugin {
         const chunk = bundle[file]
         if (chunk.type === 'chunk') {
           manifest[getChunkName(chunk)] = createChunk(chunk)
-        } else if (chunk.type === 'asset' && typeof chunk.name === 'string') {
+        } else if (chunk.type === 'asset' && chunk.names.length > 0) {
           // Add every unique asset to the manifest, keyed by its original name
-          const src = chunk.originalFileName ?? chunk.name
+          const src =
+            chunk.originalFileNames.length > 0
+              ? chunk.originalFileNames[0]
+              : chunk.names[0]
           const isEntry = entryCssAssetFileNames.has(chunk.fileName)
           const asset = createAsset(chunk, src, isEntry)
 
           // If JS chunk and asset chunk are both generated from the same source file,
           // prioritize JS chunk as it contains more information
           const file = manifest[src]?.file
-          if (file && endsWithJSRE.test(file)) continue
-
-          manifest[src] = asset
-          fileNameToAsset.set(chunk.fileName, asset)
-        }
-      }
+          if (!(file && endsWithJSRE.test(file))) {
+            manifest[src] = asset
+            fileNameToAsset.set(chunk.fileName, asset)
+          }
 
-      // Add deduplicated assets to the manifest
-      for (const [referenceId, { originalFileName }] of assets.entries()) {
-        if (!manifest[originalFileName]) {
-          const fileName = this.getFileName(referenceId)
-          const asset = fileNameToAsset.get(fileName)
-          if (asset) {
+          for (const originalFileName of chunk.originalFileNames.slice(1)) {
             manifest[originalFileName] = asset
           }
         }

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

@@ -23,7 +23,9 @@ import { fileToUrl } from './asset'
 
 type WorkerBundleAsset = {
   fileName: string
+  /** @deprecated */
   originalFileName: string | null
+  originalFileNames: string[]
   source: string | Uint8Array
 }
 
@@ -122,6 +124,7 @@ async function bundleWorkerEntry(
         saveEmitWorkerAsset(config, {
           fileName: outputChunk.fileName,
           originalFileName: null,
+          originalFileNames: [],
           source: outputChunk.code,
         })
       }
@@ -159,6 +162,7 @@ function emitSourcemapForWorkerEntry(
       saveEmitWorkerAsset(config, {
         fileName: mapFileName,
         originalFileName: null,
+        originalFileNames: [],
         source: data,
       })
     }
@@ -193,6 +197,7 @@ export async function workerFileToUrl(
     saveEmitWorkerAsset(config, {
       fileName,
       originalFileName: null,
+      originalFileNames: [],
       source: outputChunk.code,
     })
     workerMap.bundle.set(id, fileName)
@@ -468,8 +473,9 @@ export function webWorkerPlugin(config: ResolvedConfig): Plugin {
         this.emitFile({
           type: 'asset',
           fileName: asset.fileName,
-          originalFileName: asset.originalFileName,
           source: asset.source,
+          // NOTE: fileName is already generated when bundling the worker
+          //       so no need to pass originalFileNames/names
         })
       })
       workerMap.assets.clear()