@hoomersinpsom transfered to #1703

@posva any update?

vuejs/core#7524

Because :deep() is specifically as feature of scoped css, not module. It does not translate to how CSS modules work.

This issue can be closed as "won't fix" I assume.

After a bit of research, it turns out that CSS Modules has its own analog of :deep -- :globlal!
https://github.com/css-modules/css-modules#exceptions

Example:

.parent > :global(.child) {}

Is compiled to:

._parent_pjgkn_1 > .child {}

If we are using css modules exclusively in a project, and this is not supported, how to update child component styles from parent?

There is no way to target a class defined in a child's <style module>.
Consider adding a parameter to the child to control its style.

Alternatively, you can define some classes in a regular <style>, use them in your child component and then target them from parent with :global().

After a bit of research, it turns out that CSS Modules has its own analog of :deep -- :globlal! https://github.com/css-modules/css-modules#exceptions

Example:

.parent > :global(.child) {}
Is compiled to:

._parent_pjgkn_1 > .child {}

link update https://github.com/css-modules/css-modules/blob/master/docs/composition.md#exceptions