🐛 BUG: CSS generated by `Astro.glob` is included on all pages
What version of astro are you using?
1.0.0-beta.63
Are you using an SSR adapter? If so, which one?
None
What package manager are you using?
pnpm
What operating system are you using?
Mac
Describe the Bug
becase Astro.glob('../pages/posts/*.md') will render those markdown files it will also include css files used in them. The issue I noticed is that HRM logic will not unload that css files until you restart you astro dev.
Steps to reproduce:
- download
astro-hmr-css-bugbranch from https://github.com/JLarky/jlarky-blog/tree/astro-hmr-css-bug - run
astro dev - open /posts page
- now all pages including / and /contacts will have
* {color: red}css in them - restart
astro dev - now your / or /contacts are fine (i.e. not red) until you click on the /posts again
You can do the same with https://stackblitz.com/github/JLarky/jlarky-blog/tree/astro-hmr-css-bug but instead of restarting astro dev you would do a full page reload of stackblitz app
Possible solutions:
- provide
Astro.globMetadataOnlythat will skip markdown rendering 🤪 - I tested that generally Astro will unload css in less crazy setups, so there's probably some kind of leak in this more indirect case. Compare this to https://stackblitz.com/edit/github-8fswvn?file=src%2Fpages%2Fanother.astro that has
Astro.globbut if you navigate away from this page css gets properly unloaded
I first saw this issue here: https://youtu.be/EU1MLQMUeXw?t=3490 at 58:58 you can see that I switch to another page but color: red is still applied.
Link to Minimal Reproducible Example
https://stackblitz.com/github/JLarky/jlarky-blog/tree/astro-hmr-css-bug
Participation
- [ ] I am willing to submit a pull request for this issue.
So I looked into this during https://github.com/withastro/astro/pull/3932.
Seems like this is not related to HMR, but is the result of how we're crawling the module graph to discover CSS during dev. This is probably a bigger issue to tackle.
So I looked into this during #3932.
Seems like this is not related to HMR, but is the result of how we're crawling the module graph to discover CSS during dev. This is probably a bigger issue to tackle.
thank you for looking into this :) any plans to introduce globs without rendering markdown (just frontmatter) though? :)
@natemoo-re anything that we can do here before v1.0 next week?
@FredKSchott and I discussed this with the rest of the team. Given how close we are to v1.0.0, we won't be able to explore this feature in time. However, the ability to glob files while not importing any CSS (as @JLarky suggested) sounds extremely useful and is something we'd like to tackle in the future.
@natemoo-re Is this issue available to work on?
We're beginning to plan our post-v1.0 roadmap! Please comment here if this issue is affecting you so that we can get a feel for its priority: https://github.com/withastro/rfcs/discussions/247