Missing styles in production when using renderless component within server component

[logotip4ik]

Environment

• Operating System: Linux
• Node Version: v18.18.0
• Nuxt Version: 3.10.3
• CLI Version: 3.10.1
• Nitro Version: 2.8.1
• Package Manager: [email protected]
• Builder: -
• User Config: devtools, experimental
• Runtime Modules: -
• Build Modules: -

Reproduction

https://stackblitz.com/edit/nuxt-starter-sf3hkd?file=components%2FTest.vue,components%2FHero.server.vue,app.vue

1. npm run build && npm run preview
2. observe that styles from Test component are missing in build and so not included when page loads

Describe the bug

It's really weird that this happens only with production build, but anyway, when using some renderless component within .server.vue component, the styles (from that renderless component) won't be included in final bundle, so they can't be loaded. I also should mention, that the styles will be included if you move that component out of island, as it should be

Additional context

No response

Logs

No response

[bolt-new-by-stackblitz[bot]]

Start a new pull request in StackBlitz Codeflow.

• nuxt-starter-sf3hkd (Open reproduction)

[kasadawa]

The issue still exists and there so many issues with styles on child components that I cannot even think from where to start ... overall there is a big gap in this area.

In my case I have page.server.vue and components inside and I have same issue, which is missing styles of the child-component.

What I have observer is that if lang="ts" is removed then everything works fine ... it totaly doesn't make sense.

Another observation: Having startpage.vue with some styles and child component inside. The child component styles are not being rendered, they can be rendered if:

• lang="ts" is removed
• startpage.vue styles are removed
• child styles are scoped

[krmao]

nuxt have so many style bugs, sometime lose styles on prod mode, and then dev mode also loss style if upgrade nuxt versions; and also sometimes pages/index.vue style worked in prod mode but page/xxx/index.vue loss styles! it's weak! and why yarn not work but npm or pnpm work ??? https://github.com/nuxt/nuxt/issues/24133#issuecomment-2058894238