Hacktoberfest 2026: as issues que os mantenedores marcaram para outubro, abertas e boas para iniciantes. Ver issues do Hacktoberfest

Island/Markdown pages lose CSS in production when it is imported through a component

Aberta
  • Algo errado?
#452 0 comentários 0 reações 0 responsáveis Ver no GitHub

Mantenedores costumam responder em até 1 dia

@Brooooooklyn já está trabalhando nisso.

Desde 18/10/2026.

  • #481 de @Brooooooklyn — aberto

Avaliação

Dificuldade
3/5
Tempo estimado
1-2 dias
Facilidade para iniciantes
74/100
Tipo de issue
Bug
Clareza
Claramente especificada
Status de atividade
Ativa
Stack de tecnologia
react, typescript, vite
Domínio
build-system, frontend

Direção de pesquisa

Start by reading void/dist/pages/islands-plugin.mjs, especially needsIslandClientBundle() and extractCssImports(), then trace how createClientAssetTags in void/dist/routing-assets-*.mjs uses the manifest. Reproduce with the linked project using pnpm build && pnpm preview; check that production output includes the CSS link for both / and /about, including when CSS is imported through a component.

Escrita pelo modelo de indexação a partir do texto da issue.

Descrição

Describe the bug

On island pages (*.island.tsx) and Markdown pages, CSS that is imported by a regular component (for example a shared Shell rendered by pages/layout.tsx) is applied in vite dev but missing from the production build. The rendered HTML has no <link rel="stylesheet">.

This is easy to miss because everything looks correct in dev.

Reproduction

https://github.com/Nkzn/void-islands-css-missing-repro

pnpm install
pnpm dev                    # / and /about have a red background
pnpm build && pnpm preview  # / and /about have no stylesheet
  • src/Shell.tsx imports ./global.css; pages/layout.tsx renders <Shell>.
  • In the production build, dist/client is not generated at all and the CSS only appears under dist/ssr/assets/.
Expected

Production output links the CSS that the page and its layouts depend on (as dev does), even when the page ships no JavaScript.

Possible cause
  • void/dist/pages/islands-plugin.mjs
    • needsIslandClientBundle() (L23) only checks the source text of *.island.*, layout.* and _* files for island imports or CSS imports written directly in those files. Transitive imports are not considered, so the islands client entry is not built here.
    • extractCssImports() (L61) likewise only collects CSS imported directly in those files.
  • void/dist/routing-assets-*.mjs (createClientAssetTags, L115): when the islands client entry is not in the manifest, it returns empty asset tags, so no CSS link is emitted either.
Workaround

Import the CSS directly in pages/layout.tsx (import "../src/global.css"). Then virtual:void-islands-client is built and both pages get <link rel="stylesheet" href="/assets/islands-client-*.css">, still without any <script>.

Versions
Linguagem predominante
TypeScript
Estrelas
402
Forks
32
Merge médio
12h 28min
PRs com merge (30d)
77

Preparar o ambiente

Este projeto não oferece contêiner de desenvolvimento, Dockerfile nem guia de contribuição, então a configuração fica por sua conta: comece pelo README e veja nosso guia da primeira contribuição para os passos gerais.

Primeiros passos

  1. Leia a issue inteira e depois o guia de contribuição do projeto.
  2. Comente na issue dizendo que vai assumir — evita que duas pessoas façam o mesmo trabalho.
  3. Faça um fork do repositório e trabalhe em uma branch.
  4. Abra um pull request que referencie o número da issue.

Mais de voidzero-dev/void

Todas as issues de voidzero-dev/void

Issues semelhantes

Mais issues de TypeScript

Receba novas issues na sua caixa de entrada

Um resumo curto de issues do GitHub para quem está começando.