From d5078168be664538b5404b0c487bc0f78e8eafc9 Mon Sep 17 00:00:00 2001
From: Daniel Roe <daniel@roe.dev>
Date: Mon, 12 Sep 2022 11:12:41 +0100
Subject: [PATCH] fix(vite): use same asset filenames between server and client
 (#7436)

---
 packages/vite/src/client.ts |  6 ------
 packages/vite/src/vite.ts   | 10 +++++++++-
 2 files changed, 9 insertions(+), 7 deletions(-)

diff --git a/packages/vite/src/client.ts b/packages/vite/src/client.ts
index 8db4f7149b..1615a9a03b 100644
--- a/packages/vite/src/client.ts
+++ b/packages/vite/src/client.ts
@@ -8,8 +8,6 @@ import { getPort } from 'get-port-please'
 import { joinURL, withLeadingSlash, withoutLeadingSlash, withTrailingSlash } from 'ufo'
 import escapeRE from 'escape-string-regexp'
 import defu from 'defu'
-import { sanitizeFilePath } from 'mlly'
-import { filename } from 'pathe/utils'
 import type { OutputOptions } from 'rollup'
 import { cacheDirPlugin } from './plugins/cache-dir'
 import { wpfs } from './utils/wpfs'
@@ -80,10 +78,6 @@ export async function buildClient (ctx: ViteBuildContext) {
   // We want to respect users' own rollup output options
   clientConfig.build!.rollupOptions = defu(clientConfig.build!.rollupOptions!, {
     output: {
-      // https://github.com/vitejs/vite/tree/main/packages/vite/src/node/build.ts#L464-L478
-      assetFileNames: ctx.nuxt.options.dev
-        ? undefined
-        : chunk => withoutLeadingSlash(join(ctx.nuxt.options.app.buildAssetsDir, `${sanitizeFilePath(filename(chunk.name!))}.[hash].[ext]`)),
       chunkFileNames: ctx.nuxt.options.dev ? undefined : withoutLeadingSlash(join(ctx.nuxt.options.app.buildAssetsDir, '[name].[hash].js')),
       entryFileNames: ctx.nuxt.options.dev ? 'entry.js' : withoutLeadingSlash(join(ctx.nuxt.options.app.buildAssetsDir, '[name].[hash].js'))
     } as OutputOptions
diff --git a/packages/vite/src/vite.ts b/packages/vite/src/vite.ts
index b6452248bb..caf96d0061 100644
--- a/packages/vite/src/vite.ts
+++ b/packages/vite/src/vite.ts
@@ -6,6 +6,8 @@ import { logger, isIgnored, resolvePath } from '@nuxt/kit'
 import type { Options } from '@vitejs/plugin-vue'
 import replace from '@rollup/plugin-replace'
 import { sanitizeFilePath } from 'mlly'
+import { withoutLeadingSlash } from 'ufo'
+import { filename } from 'pathe/utils'
 import { buildClient } from './client'
 import { buildServer } from './server'
 import virtual from './plugins/virtual'
@@ -55,7 +57,13 @@ export async function bundle (nuxt: Nuxt) {
         css: resolveCSSOptions(nuxt),
         build: {
           rollupOptions: {
-            output: { sanitizeFileName: sanitizeFilePath }
+            output: {
+              sanitizeFileName: sanitizeFilePath,
+              // https://github.com/vitejs/vite/tree/main/packages/vite/src/node/build.ts#L464-L478
+              assetFileNames: nuxt.options.dev
+                ? undefined
+                : chunk => withoutLeadingSlash(join(nuxt.options.app.buildAssetsDir, `${sanitizeFilePath(filename(chunk.name!))}.[hash].[ext]`))
+            }
           },
           watch: {
             exclude: nuxt.options.ignore