Skip to content

fix(build): [POC] server dynamic-import-vars for RSC env (#1533)#1842

Draft
james-elicx wants to merge 1 commit into
mainfrom
fix/issue-1533-dynamic-import-fallback
Draft

fix(build): [POC] server dynamic-import-vars for RSC env (#1533)#1842
james-elicx wants to merge 1 commit into
mainfrom
fix/issue-1533-dynamic-import-fallback

Conversation

@james-elicx

Copy link
Copy Markdown
Member

Draft / POC — not ready for merge. Addresses #1533 (a next/dynamic / variable dynamic import import(\./${slug}`)renders the fallback instead of real content because variable dynamic imports aren't expanded in the RSC/server Vite environment the way Vite's clientdynamic-import-vars` plugin handles them).

This branch adds a 254-line server-dynamic-import-vars.ts plugin that builds a static candidate map for the simple case. It makes the issue's exact case pass, but a self-review surfaced material gaps that must be resolved before this is safe to merge:

  1. Static prefix/suffix discarded — import(\./icon-${name}`)` would statically pull in every sibling (incl. unrelated server-only modules), risking a server/client directive-boundary build break.
  2. Nested/suffixed patterns (import(\./${x}/index`), ./${x}.client`) miss the map → runtime throw (the very failure mode being fixed).
  3. Extension-stripped key collisions (button.tsx vs button.css) bind nondeterministically.

Recommendation: either (a) scope the plugin strictly to the bare single-variable direct-sibling case and fall through (no transform) for prefix/suffix/nested patterns to avoid regressions, or (b) invest in a robust port of Vite's dynamic-import-vars for the server environment. Given this is a single e2e test, deprioritized as not-a-small-patch. Closes #1533 only once hardened.

@pkg-pr-new

pkg-pr-new Bot commented Jun 8, 2026

Copy link
Copy Markdown

Open in StackBlitz

npm i https://pkg.pr.new/@vinext/cloudflare@1842
npm i https://pkg.pr.new/vinext@1842

commit: 38199bb

if (seen.has(key)) continue;
seen.add(key);
entries.push(
` ${JSON.stringify(key)}: () => import(${JSON.stringify(spec)}),`,
@github-actions

github-actions Bot commented Jun 8, 2026

Copy link
Copy Markdown
Contributor
Example Preview Production Original
app-router-cloudflare preview production
pages-router-cloudflare preview production
app-router-playground preview production original
realworld-api-rest preview production
nextra-docs-template preview production
benchmarks preview production
hackernews preview production original
workers-cache preview production
web preview production

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

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

2 participants