#CSS asset hash mismatch between SSR and client bundle

2 messages · Page 1 of 1 (latest)

deft swift
#

CSS asset hash mismatch between SSR and client bundle

When running the production build (node .output/server/index.mjs), the HTML served by the server references a CSS file with a different hash than what actually exists in .output/public/assets/.

Setup:
TanStack Start + Vite
Using both nitro() and tanstackStart() plugins
CSS imported as import appCssUrl from "@/styles/index.css?url"

Problem:
Server HTML contains: <link rel="stylesheet" href="/assets/index-CiTZypJk.css">
Actual file in assets: index-Cu1Fr6QW.css
Results in 404 for the stylesheet → FOUC on initial load

Workaround (works but loses cache busting):
assetFileNames: (assetInfo) => {
if (assetInfo.names?.includes("index.css")) return "assets/index.css";
return "assets/[name]-[hash][extname]";
}

Is this a known issue with using nitro() alongside tanstackStart()? Is there a proper fix?

muted agate
#

can you please provide a complete minimal reproducer project?