@rsc-kit/core 0.20.1 → 0.20.3

package/dist/vite.js

@@ -32,7 +32,8 @@ import { ownHosts } from "./hostRouting.js";
 import { unrollBarrelImports } from "./barrelImports.js";
 import { serverRendererMessage, SERVER_RENDERER, ssrProxyModule, UseSsrError, withoutSsrDirective } from "./useSsr.js";
 import { httpHostCalls } from "./hostCalls.js";
-import { clientPackages, importsServerRenderer, packageDir as installedPackageDir, packageEntryInGraph } from "./clientPackages.js";
+import { bytecodeNote } from "./bytecodeCheck.js";
+import { clientPackages, importsServerRenderer, packageDir as installedPackageDir, packageEntryInGraph, polyfillsToTrace, traceableByName } from "./clientPackages.js";
 // Resolved once per rscKit() call. One build runs in one process, so these are
 // module state rather than threaded through every helper.
 let projectRoot;
@@ -2092,6 +2093,11 @@ function metadataExports(absPath) {
     return {
         static: /export\s+const\s+metadata\b/.test(src),
         generate: /export\s+(async\s+)?function\s+generateMetadata\b/.test(src),
+        viewport: /export\s+const\s+viewport\b/.test(src),
+        writes: {
+            charset: /\bcharSet\s*=/.test(src),
+            viewport: /name\s*=\s*["']viewport["']/.test(src),
+        },
     };
 }
 /**
@@ -2258,7 +2264,6 @@ const NITRO_HANDLER_OPTIONS = `    props: (match, request) => ({
       ...match.params,
       ...Object.fromEntries(new URL(request.url).searchParams),
     }),
-    version: process.env.RSC_BUILD_VERSION,
     // A built server gzips what it answers, where the runtime can; the dev
     // server answers raw, which is what a person reading a response wants.
     compress: import.meta.env.PROD,
@@ -2340,11 +2345,15 @@ function generateEntryRsc(fallbackOrigin = "") {
         imports.push(`import ${c.alias} from ${JSON.stringify(c.absPath)}`);
         mapEntries.push(`  ${JSON.stringify(c.name)}: ${c.alias},`);
         const meta = metadataExports(c.absPath);
-        if (meta.static || meta.generate) {
-            imports.push(`import * as ${c.alias}_meta from ${JSON.stringify(c.absPath)}`);
+        if (meta.static || meta.generate || meta.viewport || meta.writes.charset || meta.writes.viewport) {
+            if (meta.static || meta.generate || meta.viewport) {
+                imports.push(`import * as ${c.alias}_meta from ${JSON.stringify(c.absPath)}`);
+            }
             const fields = [
                 meta.static ? `static: ${c.alias}_meta.metadata` : null,
                 meta.generate ? `generate: ${c.alias}_meta.generateMetadata` : null,
+                meta.viewport ? `viewport: ${c.alias}_meta.viewport` : null,
+                meta.writes.charset || meta.writes.viewport ? `writes: ${JSON.stringify(meta.writes)}` : null,
             ].filter(Boolean);
             metaEntries.push(`  ${JSON.stringify(c.name)}: { ${fields.join(", ")} },`);
         }
@@ -2583,10 +2592,57 @@ export async function handleApiRoute(
   return answer
 }
 
-const metadataMap: Record<string, { static?: any; generate?: (p: any) => any }> = {
+const metadataMap: Record<string, { static?: any; generate?: (p: any) => any; viewport?: any; writes?: { charset: boolean; viewport: boolean } }> = {
 ${metaEntries.join("\n")}
 }
 
+/**
+ * The viewport, in Next's shape: export const viewport on a layout or page,
+ * layouts outer to inner then the page, merged per key. What is not set is
+ * Next's default - width=device-width, initial-scale=1 - because a layout
+ * ported from Next never wrote the tag: Next put it there, and a page with
+ * no viewport meta is the desktop layout on a phone, which is how a port
+ * found out.
+ */
+function resolveViewport(component: string, layouts: LayoutEntry[]): Record<string, unknown> {
+  const merged: Record<string, unknown> = { width: 'device-width', initialScale: 1 }
+
+  for (const l of layouts) Object.assign(merged, metadataMap[l.component]?.viewport ?? {})
+  Object.assign(merged, metadataMap[component]?.viewport ?? {})
+
+  return merged
+}
+
+/** The content attribute for a viewport object, spelled the way browsers read it. */
+function viewportContent(viewport: Record<string, unknown>): string {
+  const names: Record<string, string> = {
+    width: 'width',
+    height: 'height',
+    initialScale: 'initial-scale',
+    minimumScale: 'minimum-scale',
+    maximumScale: 'maximum-scale',
+    userScalable: 'user-scalable',
+    viewportFit: 'viewport-fit',
+    interactiveWidget: 'interactive-widget',
+  }
+  const parts: string[] = []
+
+  for (const [key, name] of Object.entries(names)) {
+    const value = viewport[key]
+
+    if (value === undefined || value === null) continue
+
+    parts.push(name + '=' + (typeof value === 'boolean' ? (value ? 'yes' : 'no') : String(value)))
+  }
+
+  return parts.join(', ')
+}
+
+/** Whether any file on the route renders the tag itself. */
+function routeWrites(component: string, layouts: LayoutEntry[], tag: 'charset' | 'viewport'): boolean {
+  return [...layouts.map((l) => l.component), component].some((name) => metadataMap[name]?.writes?.[tag] === true)
+}
+
 const staticParamsMap: Record<string, () => any> = {
 ${paramEntries.join("\n")}
 }
@@ -2603,6 +2659,35 @@ export function manifest(): any {
   return ${JSON.stringify(routeManifest())}
 }
 
+let cachedBuildId: string | null = null
+
+/**
+ * What this build's client is, as a short id.
+ *
+ * Derived from the bootstrap script the document ships - the hashed name of
+ * the browser entry, which changes with the client references and chunks
+ * it maps - so two builds whose browsers would disagree never share one.
+ * The host puts it on every answer and compares it against what a client
+ * says it is running; a mismatch on a payload request is a 409, and the
+ * client loads the document instead. Read once, on demand, because the
+ * bootstrap content is a build product this bundle only reaches at runtime.
+ */
+export async function buildId(): Promise<string> {
+  if (cachedBuildId !== null) return cachedBuildId
+
+  const content: string = await (import.meta as any).viteRsc.loadBootstrapScriptContent('index')
+  let hash = 2166136261
+
+  for (let i = 0; i < content.length; i++) {
+    hash ^= content.charCodeAt(i)
+    hash = Math.imul(hash, 16777619) >>> 0
+  }
+
+  cachedBuildId = hash.toString(16).padStart(8, '0')
+
+  return cachedBuildId
+}
+
 /**
  * For each server action id, whether a client built it. The build asks after
  * the bundle exists, because the answer is a mark on the loaded function and
@@ -3088,6 +3173,33 @@ async function renderTree(
     return new URL(text, base).href
   }
 
+  // What Next wrote into every document without being asked, and a layout
+  // copied from a Next app therefore never writes: the charset, and the
+  // viewport - without which a phone lays the page out at desktop width.
+  // Rendered unless a file on the route renders the tag itself.
+  if (!routeWrites(component, layouts, 'charset')) head.push(createElement('meta', { key: '__cs', charSet: 'utf-8' }))
+
+  const viewport = resolveViewport(component, layouts)
+
+  if (!routeWrites(component, layouts, 'viewport')) {
+    head.push(createElement('meta', { key: '__vp', name: 'viewport', content: viewportContent(viewport) }))
+  }
+
+  // themeColor and colorScheme live on the viewport export in Next, and one
+  // set there wins over the web manifest's colour below.
+  const themeColors = viewport.themeColor as string | { media?: string; color: string }[] | undefined
+
+  if (typeof themeColors === 'string') {
+    head.push(createElement('meta', { key: '__vtc', name: 'theme-color', content: themeColors }))
+  } else if (Array.isArray(themeColors)) {
+    for (const [i, entry] of themeColors.entries()) {
+      head.push(createElement('meta', { key: '__vtc' + i, name: 'theme-color', content: entry.color, ...(entry.media ? { media: entry.media } : {}) }))
+    }
+  }
+  if (typeof viewport.colorScheme === 'string') {
+    head.push(createElement('meta', { key: '__vcs', name: 'color-scheme', content: viewport.colorScheme }))
+  }
+
   for (const [i, found] of APP_HEAD.entries()) {
     const props = { ...found.props }
 
@@ -3101,7 +3213,7 @@ async function renderTree(
   if (WEB_MANIFEST) {
     head.push(createElement('link', { key: '__mf', rel: 'manifest', href: WEB_MANIFEST.href }))
 
-    if (WEB_MANIFEST.themeColor) {
+    if (WEB_MANIFEST.themeColor && themeColors === undefined) {
       head.push(
         createElement('meta', { key: '__tc', name: 'theme-color', content: WEB_MANIFEST.themeColor }),
       )
@@ -3122,6 +3234,15 @@ async function renderTree(
     if (md.description != null) head.push(createElement('meta', { key: '__d', name: 'description', content: String(md.description) }))
     // The name only, never the version - see the identify option.
     if (manifest().build?.identify) head.push(createElement('meta', { key: '__g', name: 'generator', content: 'rsc-kit' }))
+  }
+
+  // Which build this document is, for the client to say on every navigation
+  // - read from the document rather than learned from the first answer,
+  // because a document a service worker served from its cache is the last
+  // build's while the answers are this one's. An id, not a version number.
+  if (bootstrap) head.push(createElement('meta', { key: '__v', name: 'rsc-kit:build', content: await buildId() }))
+
+  if (md) {
 
     // robots is a string, or the object Next takes: index and follow as
     // their no- forms, the flags by name, the limits as name:value. googleBot
@@ -4353,6 +4474,7 @@ async function serve(request: Request): Promise<Response> {
       handleApiRoute,
       resolveMetadata,
       runRouteMiddleware,
+      buildId,
     } as never,
 ${NITRO_HANDLER_OPTIONS}${NITRO_PRERENDERED}    maxActionBody: ${maxActionBody === undefined ? "undefined" : String(maxActionBody)},
   })
@@ -5297,18 +5419,35 @@ export function rscKit(options = {}) {
             setup(nitro) {
                 if (nitro.options.dev)
                     return;
+                // Said at the end of a bun build, only when true: which module keeps
+                // `bun build --compile --bytecode` from applying, and where. Bun
+                // itself names no file and exits 0. See bytecodeCheck.ts.
+                if (nitro.options.preset === "bun") {
+                    nitro.hooks.hook("compiled", () => {
+                        const note = bytecodeNote(nitro.options.output.serverDir);
+                        if (note)
+                            log(note);
+                    });
+                }
                 // External at Nitro's layer too. The Vite build leaves these as
                 // imports, and Nitro would then bundle them into its own chunks -
                 // which for a native package fails at load, and for a polyfill like
                 // reflect-metadata runs it after the chunk that checks for it.
                 // Traced, each is copied into .output/server/node_modules and
                 // imported by the built server the way its author expected.
-                // Only the ones the project has. Nitro's tracer says so, once per
-                // name, for every entry it cannot find - and a list of every native
-                // package anyone might install is mostly ones this app does not.
+                // Only the ones the tracer can find by name. It says so, once per
+                // name, for every entry it cannot - a list of every native package
+                // anyone might install is mostly ones this app does not have, and
+                // one the app has only through a dependency, under an isolated
+                // store, is reached through that dependency and not by name.
+                // And the polyfills, by pattern: bundled, one merged into the chunk
+                // of the dependency that checks for it, after that chunk's imports -
+                // and the server did not boot. External, the entry's import of it
+                // comes first. See polyfillsToTrace.
                 nitro.options.traceDeps = [
                     ...(nitro.options.traceDeps ?? []),
-                    ...[...DEFAULT_SERVER_EXTERNALS, ...(options.serverExternalPackages ?? [])].filter((name) => installedPackageDir(name, projectRoot) !== null || packageEntryInGraph(projectRoot, name) !== null),
+                    ...traceableByName([...DEFAULT_SERVER_EXTERNALS, ...(options.serverExternalPackages ?? [])], projectRoot),
+                    ...polyfillsToTrace(FIRST_POLYFILLS, projectRoot),
                 ];
                 // The assets, precompressed at build and served with their encoding
                 // by Nitro's own static handler; the host gzips the rest as it
@@ -5319,6 +5458,21 @@ export function rscKit(options = {}) {
                 if (typeof nitro.options.compressPublicAssets !== "object")
                     nitro.options.compressPublicAssets = true;
                 nitro.options.virtual ??= {};
+                // The names of functions survive Nitro's bundle. The pages were
+                // prerendered against Vite's own server bundles, where a dependency
+                // is loaded from node_modules under the names it was written with;
+                // Nitro then bundles that dependency into the server, and renames a
+                // function whose name collides with another's - J becomes J2 - and
+                // `name` follows the identifier. React's resume of a stored shell
+                // compares the component names it recorded with the ones it meets,
+                // and a renamed one is "Expected the resume to render <J> in this
+                // slot but instead it rendered <J2>", on every request, with the
+                // hole rendered in the browser instead. keepNames pins `name` to
+                // what the source said, whatever the identifier became.
+                nitro.options.rollupConfig = {
+                    ...(nitro.options.rollupConfig ?? {}),
+                    output: { keepNames: true, ...(nitro.options.rollupConfig?.output ?? {}) },
+                };
                 // A polyfill a dependency checks for at module evaluation, loaded
                 // before any service. The bundler places an external import after
                 // the chunk imports of the module that had it, whatever the source
@@ -5532,7 +5686,15 @@ export function rscKit(options = {}) {
                     // node_modules. Installed from npm the name resolves on its own.
                     alias: aliasEntries(),
                 },
-                build: { emptyOutDir: true },
+                build: {
+                    emptyOutDir: true,
+                    // Rolldown reports, after every build, which plugin hooks took
+                    // the time. Here the answer is always the same: the typecheck hook
+                    // - tsc, run before the bundle on purpose, as `next build` does -
+                    // and the two resolvers that look at every import. A paragraph
+                    // saying so at the end of each docker build is not a finding.
+                    rollupOptions: { checks: { pluginTimings: false } },
+                },
                 // What reaches the browser. Vite's own VITE_ prefix, and PUBLIC_ - the
                 // scaffold's spelling, and Next's minus its brand - so a variable
                 // named for a port reads through import.meta.env without a config