TanStackT
TanStack12mo ago
7 replies
sad-indigo

Tanstack start without tailwind (css modules, zero runtime css-in-js, anything but tailwind)

I am attempting to implement tanstack start with literally anything but tailwind. I am not for or against tailwind so please dont say "just use tailwind bro", simply I need to something else.

Reason being is I have legacy design systems implemented with styled-components and it is significantly easier to migrate to zero-runtime css-in-js or css modules and our team is quite good at writing clean styles without a million utility classes.

The core error revolves around FOUC (Flash of unstyled content) when the app renders.

I have a starter monorepo here https://github.com/j-mcfarlane/tanstack-start-monorepo that has a FOUC error. It is using pigment css (pigment only works with 18.3 if you upgrade to 19 it wont work).

Additionally there is an open issue on tanstack/router with a css modules example https://github.com/TanStack/router/issues/3023 with the same FOUC issues.

Has anyone gotten tanstack start working with (anything but tailwind) css modules or zero-runtime css in js? Would be grateful for any examples
GitHub
Contribute to j-mcfarlane/tanstack-start-monorepo development by creating an account on GitHub.
GitHub
Which project does this relate to? Start Describe the bug I'm struggling to make CSS Modules work properly. Currently, the styles are being loaded only on the client, causing a flash of unstyle...
How to use CSS Modules with TanStack Start? · Issue #3023 · TanStac...
Was this page helpful?