Skip to content

Styles in normal component aren't applied in web component #13495

Open
@ColonelThirtyTwo

Description

@ColonelThirtyTwo

Vue version

3.5.13

Link to minimal reproduction

https://github.com/ColonelThirtyTwo/vue-wc-styles-test

Steps to reproduce

Run pnpm run dev on the linked repo.

What is expected?

The paragraph should have a red background, as specified in the Bar.vue's <style>s.

What is actually happening?

The paragraph has no background.

System Info

System:
    OS: Linux 6.15 Arch Linux
    CPU: (16) x64 AMD Ryzen 7 5700G with Radeon Graphics
    Memory: 10.41 GB / 27.29 GB
    Container: Yes
    Shell: 4.0.2 - /usr/bin/fish
  Binaries:
    Node: 24.1.0 - /sbin/node
    Yarn: 1.22.22 - /sbin/yarn
    npm: 11.4.1 - /sbin/npm
    pnpm: 10.12.1 - /sbin/pnpm
  Browsers:
    Chromium: 137.0.7151.68
  npmPackages:
    vue: ^3.5.13 => 3.5.17

Any additional comments?

Related to #11517 - that only seems to grab styles from nested .ce.vue components and not regular .vue components, which is limiting.

Can be worked around by including the styles in the web component instead, but that defeats the point.

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions