Scoped css in Aurelia 2

Is there already a plan how scoped css will be handled in Aurelia 2?

I would like to have scoped css within a component. In Au1 it was a combination of @useShadowDom and <require from="./xy" as="scoped"></require>.

How is this working in Aurelia 2?

1 Like

There are a couple of ways. Aurelia 2 supports CSS Modules (obfuscated CSS class names) and scoped components using ShadowDOM. You can see this this tutorial an example of ShadowDOM and shared styles support. You can configure it on a global scale or per-component basis.

1 Like

Many thanks for your help, thats a great tutorial!

1 Like

If you get stuck on anything, please let me know and I’ll help you out.

Thank you very much, I actually have a follow-up question.

Is it possible to exclude a specific component from using shadow dom?

[UPDATE]
Just found this pull request, looks like that should do it! :ok_hand:

1 Like

That pull request will do the trick. My understanding is that release with the fix is quite imminent too.

1 Like