cloudflare/vinext

App Router: dynamically imported component renders fallback content instead of its actual content

Geschlossen

#1.533 geöffnet am 22.05.2026

Auf GitHub ansehenContributor Guide
 (0 Kommentare) (0 Reaktionen) (0 zugewiesene Personen)TypeScript (384 Forks)github user discovery
adapter-api-e2ehelp wanted

Repository-Metriken

Stars
 (8.625 Sterne)
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

A dynamically imported component should render its actual content (e.g. submit) but instead renders the loading/fallback text (e.g. Reload). The lazy component never resolves to its target output.

Expected component to render `submit`, rendered `Reload` (loading fallback)

Estimated Impact

~1 test failures across the deploy suite.

Affected Test Suites

  • test/e2e/app-dir/dynamic-import/dynamic-import.test.ts

Recommendation

  1. Reproduce first in vinext's own test suite. Add a next/dynamic import of a server/client component and assert the actual component text renders, not the loading fallback.

  2. Investigate why the lazy import never resolves. Check the dynamic chunk loading path: missing chunk URL, failed module evaluation, or Suspense never resolving.

Part of #1328.

Contributor Guide

Research-Richtung
Reproduzieren Sie das Problem lokal mit der Testsuite von vinext und verfolgen Sie dann den Auflösungsprozess des dynamischen Imports im Vite Plugin, um zu identifizieren, warum der Fallback bestehen bleibt. Überprüfen Sie das Laden von Chunks, die Modulbewertung und Suspense Grenzen.
Tech Stack
typescript
Domain
frontendbackend
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
GitNode.jsReactNext.js dynamic imports
EinsteigerfreundlichkeitEin Score von 1 bis 100, der schätzt, wie zugänglich dieses Issue für First-Time Contributors ist.
70