search

ionic-team / stencil

A toolchain for building scalable, enterprise-ready component systems on top of TypeScript and Web Component standards. Stencil components can be distributed natively to React, Angular, Vue, and traditional web developers from a single, framework-agnostic codebase.
https://stenciljs.com
Other
12.4k stars 775 forks source link

feat: Style modes load styles only when needed #5803

Open beele opened 1 month ago

beele commented 1 month ago

Prerequisites

Describe the Feature Request

I'm doing some testing with style modes for components and it seems that all the css is output in the javascript file that is generated for the component. I would have hoped that the css would be in dedicated css files per style mode, like the source, and that only the one that is active/needed would be loaded when the component is first rendered.

As far as I could find this is not possible right now?

Describe the Use Case

To reduce the size of the component that is sent over the wire it would be handy to have style modes load only the css of the required mode.

Describe Preferred Solution

Only the css for the active mode is loaded for the component.

Describe Alternatives

No response

Related Code

No response

Additional Information

No response

tanner-reits commented 4 weeks ago

Hey @beele! This sounds like something that could be a nice boost to Stencil. Gonna label this as a potential future feature to judge community interest!