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?