You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
When a server component imports CSS and client components also import CSS that shares the same output file, the <link> tag ordering in SSR output is non-deterministic on the first request. The order between serverResources CSS (data-precedence="vite-rsc/importer-resources") and clientReferenceDeps CSS (data-precedence="vite-rsc/client-reference") is inconsistent. On subsequent requests, they appear in the correct order.
This causes style conflicts when both CSS sources contain rules for the same selectors with different values, since the cascade depends on source order.
I've opened a draft PR at #1099 with a minimal fix:
Proposed solution:
In preloadDeps(), ensure server resources CSS (importer-resources precedence) is registered before client reference CSS (client-reference precedence). This ensures index.css loads before entry.css consistently, maintaining the correct cascade order regardless of timing.
Happy to iterate on the approach if there's a better way to handle this.
Related plugins
plugin-react
plugin-react-swc
plugin-react-oxc
plugin-rsc
Describe the bug
Description
When a server component imports CSS and client components also import CSS that shares the same output file, the
<link>tag ordering in SSR output is non-deterministic on the first request. The order betweenserverResourcesCSS (data-precedence="vite-rsc/importer-resources") andclientReferenceDepsCSS (data-precedence="vite-rsc/client-reference") is inconsistent. On subsequent requests, they appear in the correct order.This causes style conflicts when both CSS sources contain rules for the same selectors with different values, since the cascade depends on source order.
Reproduction
2026-02-07.00.44.49.mov
Repository: https://github.com/iamchanii/vite-plugin-rsc-test
Observed Behavior
The CSS load order is non-deterministic:
positionisstatic(entry.css overrides index.css)positionisabsolute(index.css loads first)Note: The incorrect order can appear randomly, not just on the first request.
Inspecting
<head>First request:
Subsequent requests (correct order):
Possible Fix
I've opened a draft PR at #1099 with a minimal fix:
Proposed solution:
In
preloadDeps(), ensure server resources CSS (importer-resourcesprecedence) is registered before client reference CSS (client-referenceprecedence). This ensures index.css loads before entry.css consistently, maintaining the correct cascade order regardless of timing.Happy to iterate on the approach if there's a better way to handle this.
Reproduction
https://github.com/iamchanii/vite-plugin-rsc-test
Steps to reproduce
bun install bun run build && bun run startpositionvalue displayedpositionvalue againSystem Info
System: OS: macOS 26.2 CPU: (11) arm64 Apple M3 Pro Memory: 157.41 MB / 36.00 GB Shell: 5.9 - /bin/zsh Binaries: Node: 24.4.1 - /Users/ette/.local/share/mise/installs/node/24.4.1/bin/node Yarn: 1.22.21 - /Users/ette/.local/share/mise/installs/node/24.4.1/bin/yarn npm: 11.4.2 - /Users/ette/.local/share/mise/installs/node/24.4.1/bin/npm pnpm: 8.14.3 - /Users/ette/.local/share/mise/installs/node/24.4.1/bin/pnpm bun: 1.3.5 - /Users/ette/.local/share/mise/installs/bun/1.3.5/bin/bun Browsers: Chrome: 144.0.7559.133 Edge: 144.0.3719.115 Safari: 26.2 Safari Technology Preview: 18.4 npmPackages: @vitejs/plugin-react: latest => 5.1.3 @vitejs/plugin-rsc: latest => 0.5.19 vite: ^7.3.1 => 7.3.1Used Package Manager
bun
Logs
No response
Validations