Skip to content

Conversation

@serhalp
Copy link
Contributor

@serhalp serhalp commented Jan 22, 2026

Tailwind CSS v4's @import directive needs an explicit source() path to ensure consistent CSS asset hashing between client and server builds. Without this, builds can result in the server-rendered page referencing an nonexistent CSS asset, resulting in a 404 (which may manifest in browser devtools as a CORS error).

You can see an example here (open devtools to see error): https://69725dbd6dcf150f9fbaeb37--vermillion-brigadeiros-35570b.netlify.app/ (source: https://github.com/serhalp/demo-tanstack-start-20160121).

This updates all examples, e2e fixtures, and documentation to use:

@import 'tailwindcss' source('../');

Fixes #4959.

Supersedes #4606.

(I haven't confirmed but I suspect this was introduced in #5580.)

Tailwind CSS v4's `@import` directive needs an explicit `source()` path to ensure consistent CSS asset
hashing between client and server builds. Without this, builds can result in the server-rendered page
referencing an nonexistent CSS asset, resulting in a 404 (which may manifest in browser devtools as
a CORS error).

You can see an example here (open devtools to see error):
https://69725dbd6dcf150f9fbaeb37--vermillion-brigadeiros-35570b.netlify.app/
(source: https://github.com/serhalp/demo-tanstack-start-20160121).

This updates all examples, e2e fixtures, and documentation to use:
```
@import 'tailwindcss' source('../');
```

Fixes TanStack#4959.

Supersedes TanStack#4606.

---
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
@coderabbitai
Copy link
Contributor

coderabbitai bot commented Jan 22, 2026

Important

Review skipped

Too many files!

43 files out of 193 files are above the max files limit of 150.

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.


Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands and usage tips.

@github-actions github-actions bot added the documentation Everything documentation related label Jan 22, 2026
@nx-cloud
Copy link

nx-cloud bot commented Jan 22, 2026

View your CI Pipeline Execution ↗ for commit 474b2ef

Command Status Duration Result
nx affected --targets=test:eslint,test:unit,tes... ✅ Succeeded 1m 40s View ↗
nx run-many --target=build --exclude=examples/*... ✅ Succeeded 1s View ↗

☁️ Nx Cloud last updated this comment at 2026-01-22 23:37:20 UTC

@pkg-pr-new
Copy link

pkg-pr-new bot commented Jan 22, 2026

More templates

@tanstack/arktype-adapter

npm i https://pkg.pr.new/TanStack/router/@tanstack/arktype-adapter@6459

@tanstack/eslint-plugin-router

npm i https://pkg.pr.new/TanStack/router/@tanstack/eslint-plugin-router@6459

@tanstack/history

npm i https://pkg.pr.new/TanStack/router/@tanstack/history@6459

@tanstack/nitro-v2-vite-plugin

npm i https://pkg.pr.new/TanStack/router/@tanstack/nitro-v2-vite-plugin@6459

@tanstack/react-router

npm i https://pkg.pr.new/TanStack/router/@tanstack/react-router@6459

@tanstack/react-router-devtools

npm i https://pkg.pr.new/TanStack/router/@tanstack/react-router-devtools@6459

@tanstack/react-router-ssr-query

npm i https://pkg.pr.new/TanStack/router/@tanstack/react-router-ssr-query@6459

@tanstack/react-start

npm i https://pkg.pr.new/TanStack/router/@tanstack/react-start@6459

@tanstack/react-start-client

npm i https://pkg.pr.new/TanStack/router/@tanstack/react-start-client@6459

@tanstack/react-start-server

npm i https://pkg.pr.new/TanStack/router/@tanstack/react-start-server@6459

@tanstack/router-cli

npm i https://pkg.pr.new/TanStack/router/@tanstack/router-cli@6459

@tanstack/router-core

npm i https://pkg.pr.new/TanStack/router/@tanstack/router-core@6459

@tanstack/router-devtools

npm i https://pkg.pr.new/TanStack/router/@tanstack/router-devtools@6459

@tanstack/router-devtools-core

npm i https://pkg.pr.new/TanStack/router/@tanstack/router-devtools-core@6459

@tanstack/router-generator

npm i https://pkg.pr.new/TanStack/router/@tanstack/router-generator@6459

@tanstack/router-plugin

npm i https://pkg.pr.new/TanStack/router/@tanstack/router-plugin@6459

@tanstack/router-ssr-query-core

npm i https://pkg.pr.new/TanStack/router/@tanstack/router-ssr-query-core@6459

@tanstack/router-utils

npm i https://pkg.pr.new/TanStack/router/@tanstack/router-utils@6459

@tanstack/router-vite-plugin

npm i https://pkg.pr.new/TanStack/router/@tanstack/router-vite-plugin@6459

@tanstack/solid-router

npm i https://pkg.pr.new/TanStack/router/@tanstack/solid-router@6459

@tanstack/solid-router-devtools

npm i https://pkg.pr.new/TanStack/router/@tanstack/solid-router-devtools@6459

@tanstack/solid-router-ssr-query

npm i https://pkg.pr.new/TanStack/router/@tanstack/solid-router-ssr-query@6459

@tanstack/solid-start

npm i https://pkg.pr.new/TanStack/router/@tanstack/solid-start@6459

@tanstack/solid-start-client

npm i https://pkg.pr.new/TanStack/router/@tanstack/solid-start-client@6459

@tanstack/solid-start-server

npm i https://pkg.pr.new/TanStack/router/@tanstack/solid-start-server@6459

@tanstack/start-client-core

npm i https://pkg.pr.new/TanStack/router/@tanstack/start-client-core@6459

@tanstack/start-fn-stubs

npm i https://pkg.pr.new/TanStack/router/@tanstack/start-fn-stubs@6459

@tanstack/start-plugin-core

npm i https://pkg.pr.new/TanStack/router/@tanstack/start-plugin-core@6459

@tanstack/start-server-core

npm i https://pkg.pr.new/TanStack/router/@tanstack/start-server-core@6459

@tanstack/start-static-server-functions

npm i https://pkg.pr.new/TanStack/router/@tanstack/start-static-server-functions@6459

@tanstack/start-storage-context

npm i https://pkg.pr.new/TanStack/router/@tanstack/start-storage-context@6459

@tanstack/valibot-adapter

npm i https://pkg.pr.new/TanStack/router/@tanstack/valibot-adapter@6459

@tanstack/virtual-file-routes

npm i https://pkg.pr.new/TanStack/router/@tanstack/virtual-file-routes@6459

@tanstack/vue-router

npm i https://pkg.pr.new/TanStack/router/@tanstack/vue-router@6459

@tanstack/vue-router-devtools

npm i https://pkg.pr.new/TanStack/router/@tanstack/vue-router-devtools@6459

@tanstack/vue-router-ssr-query

npm i https://pkg.pr.new/TanStack/router/@tanstack/vue-router-ssr-query@6459

@tanstack/vue-start

npm i https://pkg.pr.new/TanStack/router/@tanstack/vue-start@6459

@tanstack/vue-start-client

npm i https://pkg.pr.new/TanStack/router/@tanstack/vue-start-client@6459

@tanstack/vue-start-server

npm i https://pkg.pr.new/TanStack/router/@tanstack/vue-start-server@6459

@tanstack/zod-adapter

npm i https://pkg.pr.new/TanStack/router/@tanstack/zod-adapter@6459

commit: 474b2ef

@serhalp serhalp marked this pull request as ready for review January 22, 2026 23:34
@schiller-manuel schiller-manuel changed the title fix: add source() to Tailwind v4 imports to ensure consistent hashing chore: add source() to Tailwind v4 imports to ensure consistent hashing Jan 23, 2026
@schiller-manuel schiller-manuel merged commit 6ff1190 into TanStack:main Jan 24, 2026
6 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

documentation Everything documentation related

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Tanstack Start: Asset hash mismatch between client and server-side (SSR) assets in Dockerfile build

2 participants