CSS Module chunk loaded in <script> tag
Unanswered
Sloth bear posted this in #help-forum
Sloth bearOP
I'm having an issue with a CSS chunk being loaded in a script tag instead of a link/stylesheet tag, obviously making the style break on the page.
The guilty component is isolated in its own library and is using CSS Modules (scss) for styling. The library exposes a single server component, that has one single client component down in the tree. The client component seems to be the one where Next tries to be fancy and build a CSS chunk that can't load. I have 2 apps using that same component, it's working fine for one and breaks for the other so I'm guessing it's an app problem rather thean a component problem.
For the breaking app, I got 2 stylesheets generated, I'm getting this added to the dom (corresponding to the client component part of the tree):
For the working app, I'm getting all the CSS in a single sheet with all the styles properly packed together (including client components).
One question: is there a way to force Next to build a single stylesheet rather than being fancy and trying to optimize?
Beyond that, I'm not sure what else to share, I feel like I tried everything to isolate the problem but couldn't find a single clue on what's causing that, so hopefully someone can have me look in a certain direction because I'm just lost at this point. Thanks
The guilty component is isolated in its own library and is using CSS Modules (scss) for styling. The library exposes a single server component, that has one single client component down in the tree. The client component seems to be the one where Next tries to be fancy and build a CSS chunk that can't load. I have 2 apps using that same component, it's working fine for one and breaks for the other so I'm guessing it's an app problem rather thean a component problem.
For the breaking app, I got 2 stylesheets generated, I'm getting this added to the dom (corresponding to the client component part of the tree):
<script src="/_next/static/css/adc723de218100cc.css" async=""></script>For the working app, I'm getting all the CSS in a single sheet with all the styles properly packed together (including client components).
One question: is there a way to force Next to build a single stylesheet rather than being fancy and trying to optimize?
Beyond that, I'm not sure what else to share, I feel like I tried everything to isolate the problem but couldn't find a single clue on what's causing that, so hopefully someone can have me look in a certain direction because I'm just lost at this point. Thanks