Is it possible to combine multiple <style> tags into one?

[dungle-scrubs]

Just noticing that I have about a hundred or so <style data-emotion="css" data-s> tags in the DOM and am looking for an option to combine them all into one or at least much fewer.

Is this possible?

Thanks in advance.

[Andarist]

If you are using default setup - this is done automatically in production for you. Splitting styles between different elements allows them to be editable in dev tools during development.

[mykz]

@Andarist How would you handle this with the '@emotion/css' css() api? I've checked and it seems that on every call of css() it creates a new style tag, even on production builds.

[Andarist]

@mykz this shouldnt happen in the browser (im excluding SSR scenarios for simplicity of explanation). Please provide a repro case or I won't be able to look into this

[mykz]

@Andarist Thanks for the fast response. I think it might be the way I have it setup, I'm going to investigate more and if I can't resolve it I'll submit a repo case.

[rs178]

@dungle-scrubs Were you able to combine them? Pls let me know if you did, thanks!