CSS Bundle Usage | Remix | Page 1

rotund prairie Jan 15, 2024, 6:11 AM

#

So this one makes sense, but I don't see why you have to have bundling when you're just linking the .css file like you would already do...
https://remix.run/docs/en/main/styling/css-modules

Remix

CSS Modules

#

This one I don't get at all lol
https://remix.run/docs/en/main/styling/css-imports

Remix

CSS Imports

#

This makes the most sense, and sounds the way to go
https://remix.run/docs/en/main/styling/vanilla-extract

Remix

Vanilla Extract

#

Open to suggestions & information 😄

rotund prairie Jan 15, 2024, 7:22 PM

#

^ BuMp ^

rotund prairie Jan 21, 2024, 8:54 PM

#

Still messing with this cssBundleHref thing and I am missing something. Here is what I have...

import type { LinksFunction } from "@remix-run/cloudflare";
import appStyles from "~/styles/app.css";
import { cssBundleHref } from "@remix-run/css-bundle";
//Other imports from @remix-run/react;

export const links: LinksFunction = () => [
  ...(cssBundleHref ? [{ rel: "stylesheet", href: cssBundleHref }] : []),
  { rel: "stylesheet", href: appStyles },
];

And my css is just a css file. When I run npm run dev it is working, but when I have it built on cloudflare it doesn't work. I suppose I wonder why even have the import { cssBundleHref } from "@remix-run/css-bundle"; when the export const links: LinksFunction = () => [ is what I would have anyway? Also, why does it not work on Cloudflare?

#CSS Bundle Usage