Component scoped style is not applied to the upper level element about vue-loader

[isaaclyman]

@yyx990803 For posterity, can you clarify what :root and :scope do here? Are they the equivalent of :host in Angular 2 scoped styles? (referring to the component's tag itself, in a named component)

[yyx990803]

You need to use :root to refer to the root element.

[yyx990803]

Note in 3.0.0 it's changed to :scope

[jdstaerk]

Hey, sorry for re-opening this topic, but I'd like to know that too. I can't find anything related to :root or :scope in the docs.

[LinusBorg]

...which is because this comment was made about vue-loader 3.0.0 - we are 10 major versions beyond this now. scoped styles work differently now and this whole thread does not apply anymore.

[blowsie]

I also ended up here...
How to achieve to following?

<style scoped>
:scope {
  --color: #000;
}
.link {
 color: var(--color);
}
</style>