css takes effect in dev, but not prod

[sacred kelp]

My app's __root.tsx imports my CSS like below. Is this correct?

import "uno.css"; 
import "@/styles/global.css";

My CSS applies when running for dev, but not for production build, even though javascript and all routes work. The prod build's dist/_build/assets does contain a CSS file with expected file contents.

Do I need to manually add CSS to the document head element or something?

Here is dist dir. You can see client-adsfs.css and ssr-sfsdf.css. I have no set up ssr, so this must just always be there

[errant light]

what does "not setup SSR " mean?

we don't have much css support right now in start apart from importing via ?url
proper css support will follow soon once we have migrated off vinxi

[sacred kelp]

I haven't done anything ssr-related, is all.

I'll try adding ?url to see if that sorts it

ok, nope adding ?url actually broke styles in dev. So I'll remove it so they work in dev at least. If any other suggestions to troubleshoot please lmk

[errant light]

I don't understand. start will SSR

[errant light]

you then need to link the style in head()

[sacred kelp]

how can I do that if I don't know what file name will be generated by vite?

ohhh using ?url there let me try

[errant light]

just like all our start examples do

[sacred kelp]

Ok. I started from the Convex Tanstack Start template and it didn't have any css
(npm create convex@latest -- -t tanstack-start)

[errant light]

sorry don't know that template

[sacred kelp]

I got this working for global.css! Ty!
Still trying to sort out unocss b/c it does not behave the same for some reason

Working code for future searchers:

// 1. unocss works in dev, but not prod. I'm still researching for this one. 2.) global css works in dev and prod now.
import "uno.css"; 
import globalCSS from "@/styles/global.css?url";

export const Route = createRootRouteWithContext<{
  queryClient: QueryClient;
}>()({
  head: () => ({
    meta: [
      {
        charSet: "utf-8",
      },
      {
        name: "viewport",
        content: "width=device-width, initial-scale=1",
      },
      {
        title: "TanStack Start",
      },
    ],
    links: [
      { rel: "stylesheet", href: globalCSS }
    ],
  }),
  notFoundComponent: () => <div>Route not found</div>,
  component: RootComponent,
});

[errant light]

as I wrote above, we are working on full css /css module support. stay tuned. then you won't need to import via ?url

[true flicker]

When are you planning to migrate of Vinxi, can i track any progress on this in the repo? Im planning to migrate a React app build with Vite and Tanstack router to Tanstack Start.

[errant light]

migration is ongoing at the moment. cannot give an estimate here. it's our top priority. once vinxi is gone,I can continue to implement css support

[true flicker]

alright thanks! im not that interested in css support since i will be using tailwind, was just curious how the migration from Vinxi was going. i see a branch 'devinxi' i think that is where its happening.
Will is be a lot of work if i migrate to start now. the only thing i will be using the server for is a layer between the frontend and our separate backend.

[errant light]

we hope the migration will be easy. API routes will need some modifications. aside from that it's mostly config changes (from app.config.ts to vite.config.ts)

[true flicker]

Thanks!

[errant light]

if you plan to use any of the currently exposed nitro features (e.g. prerendering) , those will also change