cloudflare/vinext

`next/dynamic`: CSS imported by dynamically loaded components not applied

Open

#1.515 geöffnet am 22. Mai 2026

Auf GitHub ansehen
 (0 Kommentare) (0 Reaktionen) (0 zugewiesene Personen)TypeScript (329 Forks)github user discovery
adapter-api-e2ehelp wanted

Repository-Metriken

Stars
 (8.120 Stars)
PR-Merge-Metriken
 (Durchschn. Merge 1T 1h) (462 gemergte PRs in 30 T)

Beschreibung

This issue was created by an agent analysing CI failures from the Next.js Deploy Suite (vinext main vs Next.js v16.2.6, 2026-05-22).

Problem

When a component is loaded via next/dynamic, the CSS it imports (global, CSS modules) is not injected into the page. Components fail to become visible (zero size due to missing styles), causing all 4 tests in the suite to time out waiting for elements.

waiting for locator('#server') to be visible — CSS for dynamic component never injected

Estimated Impact

~4 test failures across the deploy suite.

Affected Test Suites

  • test/e2e/app-dir/next-dynamic-css/next-dynamic-css.test.ts (4 failures)

Recommendation

  1. Reproduce first in vinext's own test suite. Add a next/dynamic import of a component that imports a CSS module and assert the rendered text is visible (i.e. CSS was applied).

  2. Inject the dynamic component's CSS on load. When the dynamic chunk loads, append its associated CSS to the document. Use Vite's CSS asset metadata.

Part of #1328.

Contributor Guide

Research-Richtung
Überprüfen Sie den Ladevorgang dynamischer Chunks in Vite und stellen Sie sicher, dass CSS Assets beim Laden des Chunks in das Dokument eingefügt werden.
Tech Stack
typescriptvitenextjs
Domain
frontendbuild system
Issue Type
Fehler
SchwierigkeitGeschätzte Implementierungsschwierigkeit für neue Contributors, von 1 für sehr kleine Änderungen bis 5 für Expertenarbeit.
2
Geschätzte ZeitEin grober Zeitrahmen, um zu recherchieren, zu implementieren, zu testen und einen Pull Request vorzubereiten.
1-3 Stunden
AktivitätsstatusWie verfügbar das Issue gerade wirkt: frisch, aktiv, stale, blockiert oder wartet auf Maintainer-Input.
Frisch
KlarheitWie klar das Issue die erwartete Änderung, Akzeptanzkriterien und den nächsten Schritt erklärt.
Klar
Voraussetzungen
GitTypeScriptVite
EinsteigerfreundlichkeitEin Score von 1 bis 100, der schätzt, wie zugänglich dieses Issue für First-Time Contributors ist.
70