I'm working on a Qwik web application and have run into an issue where my custom CSS files are not being applied on page refreshes.
In my router-head.tsx, I'm importing the CSS files like:
<link href="assets/css/style.css" rel="stylesheet" />
This works fine on the initial page load, but when I refresh within a route, the styles are no longer applied.
However, if I start from the root index page, the CSS is loaded correctly. It seems the issue only happens on refresh within a subroute.
Things I've tried:
- Importing CSS directly in the component as well as the router-head
- Using tags instead of @import
- Verified CSS files are copied to dist on build
- Checked browser console for errors
- The CSS is imported in index.tsx as well, so it should be globally available. But for some reason refreshes on subroutes cause it to not apply.
Any ideas what could be causing this or how to properly setup global CSS in a Qwik site? Is there something fundamental I'm missing about how routing and CSS works?
Appreciate any help troubleshooting! Let me know if any other details would be useful.