mnfst-render 0.5.25 → 0.5.27

package/manifest.render.mjs

@@ -214,102 +214,18 @@ function parseArgs() {
 function loadConfig(rootDir) {
   const manifestPath = join(rootDir, 'manifest.json');
   if (!existsSync(manifestPath)) {
-    return { render: {} };
+    return { prerender: {} };
   }
   const raw = readFileSync(manifestPath, 'utf8');
   let manifest;
   try {
     manifest = JSON.parse(raw);
   } catch {
-    return { render: {} };
+    return { prerender: {} };
   }
   return manifest;
 }
 
-// Move credential-shaped values out of manifest.json into .env. Anything
-// inlined into manifest.json ships verbatim into dist/ (the file is copied
-// to the output unchanged), so a literal devKey there is a production leak.
-// Rewriting source AND the in-memory object covers both directions: future
-// renders see the placeholder, and the dist copy this run produces does too.
-// Idempotent — values already shaped like ${VAR} are skipped.
-function relocateSecretsToEnv(rootDir, manifest) {
-  const moves = [];
-
-  function maybeMove(obj, key, envVar, displayPath) {
-    if (!obj || typeof obj !== 'object') return;
-    const v = obj[key];
-    if (typeof v !== 'string' || !v) return;
-    if (/^\$\{[^}]+\}$/.test(v)) return; // already a placeholder
-    moves.push({ obj, key, value: v, envVar, displayPath });
-  }
-
-  maybeMove(manifest.appwrite, 'devKey', 'APPWRITE_DEV_KEY', 'appwrite.devKey');
-  if (manifest.data && typeof manifest.data === 'object') {
-    for (const [srcName, src] of Object.entries(manifest.data)) {
-      maybeMove(src, 'appwriteDevKey', 'APPWRITE_DEV_KEY', `data.${srcName}.appwriteDevKey`);
-    }
-  }
-
-  if (moves.length === 0) return manifest;
-
-  for (const m of moves) {
-    m.obj[m.key] = `\${${m.envVar}}`;
-  }
-
-  const manifestPath = join(rootDir, 'manifest.json');
-  try {
-    writeFileSync(manifestPath, JSON.stringify(manifest, null, 4) + '\n');
-  } catch (err) {
-    console.error(`mnfst-render: failed to rewrite ${manifestPath}: ${err.message}`);
-    process.exit(1);
-  }
-
-  const envPath = join(rootDir, '.env');
-  let envText = '';
-  try {
-    if (existsSync(envPath)) envText = readFileSync(envPath, 'utf8');
-  } catch {}
-  if (envText && !envText.endsWith('\n')) envText += '\n';
-
-  const existingVars = new Set();
-  for (const line of envText.split(/\r?\n/)) {
-    const m = line.match(/^([A-Z_][A-Z0-9_]*)\s*=/);
-    if (m) existingVars.add(m[1]);
-  }
-
-  const additions = [];
-  for (const m of moves) {
-    if (!existingVars.has(m.envVar)) {
-      additions.push(`${m.envVar}=${m.value}`);
-      existingVars.add(m.envVar);
-    }
-  }
-
-  if (additions.length) {
-    try {
-      writeFileSync(envPath, envText + additions.join('\n') + '\n');
-    } catch (err) {
-      console.error(`mnfst-render: failed to write ${envPath}: ${err.message}`);
-      process.exit(1);
-    }
-  }
-
-  console.warn('');
-  console.warn('mnfst-render: relocated credentials from manifest.json to .env');
-  for (const m of moves) {
-    console.warn(`  • ${m.displayPath} → \${${m.envVar}}`);
-  }
-  if (additions.length) {
-    console.warn(`  Appended ${additions.length} var(s) to .env (verify .env is in .gitignore).`);
-  } else {
-    console.warn('  .env already had matching vars; manifest.json placeholders now point at them.');
-  }
-  console.warn('  Browser-side dev needs window.env populated separately (e.g. env.local.js).');
-  console.warn('');
-
-  return manifest;
-}
-
 function normalizeLocaleRouteExclude(val) {
   if (val == null) return [];
   if (Array.isArray(val)) return val.map((s) => String(s).trim()).filter(Boolean);
@@ -321,44 +237,45 @@ function resolveConfig() {
   const cli = parseArgs();
   const cwd = process.cwd();
   const root = resolve(cwd, cli.root ?? '.');
-  const manifest = relocateSecretsToEnv(root, loadConfig(root));
-  const ren = manifest.render ?? {};
+  const manifest = loadConfig(root);
+  const pre = manifest.prerender ?? {};
 
-  const localUrl = (cli.localUrl ?? cli.baseUrl ?? process.env.PRERENDER_BASE ?? ren.localUrl ?? ren.baseUrl)?.replace(/\/$/, '');
+  const localUrl = (cli.localUrl ?? cli.baseUrl ?? process.env.PRERENDER_BASE ?? pre.localUrl ?? pre.baseUrl)?.replace(/\/$/, '');
   const serve = cli.localUrl ? false : (cli.serve !== undefined ? !!cli.serve : true);
   if (!serve && !localUrl) {
-    console.error('prerender: localUrl is required when not using built-in server. Set manifest.render.localUrl or use --local.');
+    console.error('prerender: localUrl is required when not using built-in server. Set manifest.prerender.localUrl or use --local.');
     process.exit(1);
   }
-  const liveUrl = (cli.liveUrl ?? process.env.PRERENDER_LIVE ?? manifest.live_url ?? manifest.liveUrl ?? ren.live_url ?? ren.liveUrl ?? localUrl ?? '')?.replace(/\/$/, '');
+  const liveUrl = (cli.liveUrl ?? process.env.PRERENDER_LIVE ?? manifest.live_url ?? manifest.liveUrl ?? pre.live_url ?? pre.liveUrl ?? localUrl ?? '')?.replace(/\/$/, '');
 
   return {
     localUrl: localUrl ?? '',
     liveUrl,
     serve,
-    output: resolve(root, cli.output ?? ren.output ?? 'website'),
+    output: resolve(root, cli.output ?? pre.output ?? 'website'),
     root,
-    routerBase: ren.routerBase ?? null,
+    manifest,
+    routerBase: pre.routerBase ?? null,
     /** Logical path prefixes (after locale) that skip sticky locale prefix; see manifest:locale-route-exclude */
     localeRouteExclude: normalizeLocaleRouteExclude(
-      ren.localeRouteExclude ?? ren.localeStickyExclude
+      pre.localeRouteExclude ?? pre.localeStickyExclude
     ),
-    locales: ren.locales,
-    redirects: Array.isArray(ren.redirects) ? ren.redirects : [],
-    wait: cli.wait ?? ren.wait ?? null,
+    locales: pre.locales,
+    redirects: Array.isArray(pre.redirects) ? pre.redirects : [],
+    wait: cli.wait ?? pre.wait ?? null,
     waitAfterIdle: 0,
     // Default concurrency: 2.  Chromium per-page memory overhead is large and
     // our hydration source-attribute map adds more per page.  On big sites
     // (>100 routes) higher concurrency crashes the browser with OOM/target
     // closed errors.  Users can override for small projects with --concurrency.
-    concurrency: Math.max(1, cli.concurrency ?? ren.concurrency ?? 2),
-    retries: Math.max(0, cli.retries ?? ren.retries ?? 2),
+    concurrency: Math.max(1, cli.concurrency ?? pre.concurrency ?? 2),
+    retries: Math.max(0, cli.retries ?? pre.retries ?? 2),
     localeSubstitution: true,
     localeSubstitutionExclude: [],
     /** Explicit locale-neutral paths to render in addition to those discovered automatically.
      *  Each entry is expanded to all locale variants (e.g. "legal/privacy" → "cs/legal/privacy", ...) */
-    paths: Array.isArray(ren.paths)
-      ? ren.paths.map((p) => String(p).replace(/^\/+|\/+$/g, '')).filter(Boolean)
+    paths: Array.isArray(pre.paths)
+      ? pre.paths.map((p) => String(p).replace(/^\/+|\/+$/g, '')).filter(Boolean)
       : [],
     dryRun: !!cli.dryRun,
     debugPrerender: !!cli.debugPrerender,
@@ -367,12 +284,12 @@ function resolveConfig() {
     // fall back to the timeout.  10s gives slow data plugin pipelines a
     // chance while bounding worst-case per-path overhead.
     pipelineTimeout: 10000,
-    // SEO / AEO meta injection — see metaInjection() and the render.meta
+    // SEO / AEO meta injection — see metaInjection() and the prerender.meta
     // section of manifest.json.  Layered precedence (highest first):
     //   1. <template data-head> per-route (already in DOM at snapshot time)
     //   2. <head> in index.html (already in DOM at snapshot time)
-    //   3. render.meta.* expressions (Alpine-evaluated per route)
-    //   4. render.meta.fallback.* (static strings if expression empty)
+    //   3. prerender.meta.* expressions (Alpine-evaluated per route)
+    //   4. prerender.meta.fallback.* (static strings if expression empty)
     //   5. PWA-style manifest.json fields (name, description, author, icons)
     //   6. Smart defaults derived from the rendered DOM (h1, first p, etc.)
     //
@@ -383,10 +300,10 @@ function resolveConfig() {
       siteDescription: manifest.description || null,
       siteAuthor: manifest.author || null,
       icons: Array.isArray(manifest.icons) ? manifest.icons : [],
-      meta: ren.meta || null,
-      structuredData: ren.structuredData || null,
-      imageSnapshots: ren.meta?.imageSnapshots !== false, // default true
-      defaults: ren.meta?.defaults !== false,             // default true
+      meta: pre.meta || null,
+      structuredData: pre.structuredData || null,
+      imageSnapshots: pre.meta?.imageSnapshots !== false, // default true
+      defaults: pre.meta?.defaults !== false,             // default true
     },
   };
 }
@@ -808,6 +725,18 @@ function stripDataTailwindAttr(html) {
   return html.replace(/\sdata-tailwind(?:=(["']).*?\1)?/gi, '');
 }
 
+/** Prepend `<!DOCTYPE html>` unless one is already present.
+ *
+ * The snapshot is captured via `document.documentElement.outerHTML`, which
+ * serializes only the <html> subtree and drops the document's doctype.
+ * Shipping that doctype-less HTML triggers quirks mode in browsers and is
+ * flagged by Lighthouse/PageSpeed.  Re-add it at write time so every emitted
+ * page (Puppeteer-rendered base pages and substituted locale variants) is in
+ * standards mode. */
+function ensureDoctype(html) {
+  return /^\s*<!doctype\b/i.test(html) ? html : `<!DOCTYPE html>\n${html}`;
+}
+
 /** Theme class de-bake + synchronous bootstrap.
  *
  * Puppeteer applies `<html class="light">` or `<html class="dark">` based on
@@ -853,18 +782,18 @@ function debakeThemeClass(html) {
   return out;
 }
 
-/** Manifest utilities plugin: <style id="utility-styles"> and <style id="utility-styles-critical"> */
+/** Manifest utilities plugin: <style id="manifest-styles"> and <style id="manifest-styles-critical"> */
 function extractUtilityStyleBlocks(html) {
   const blocks = [];
   let out = html.replace(
-    /<style[^>]*\bid=["']utility-styles-critical["'][^>]*>([\s\S]*?)<\/style>/gi,
+    /<style[^>]*\bid=["']manifest-styles-critical["'][^>]*>([\s\S]*?)<\/style>/gi,
     (_, css) => {
       const t = (css || '').trim();
       if (t) blocks.push({ kind: 'critical', css: t });
       return '';
     }
   );
-  out = out.replace(/<style[^>]*\bid=["']utility-styles["'][^>]*>([\s\S]*?)<\/style>/gi, (_, css) => {
+  out = out.replace(/<style[^>]*\bid=["']manifest-styles["'][^>]*>([\s\S]*?)<\/style>/gi, (_, css) => {
     const t = (css || '').trim();
     if (t) blocks.push({ kind: 'main', css: t });
     return '';
@@ -926,9 +855,9 @@ function promptContinueWithRuntimeTailwind(rootDir) {
 /**
  * Build a static Tailwind stylesheet via @tailwindcss/cli (v4+), scanning project sources.
  * Only runs when the project uses data-tailwind on the manifest script tag (auto-detected).
- * Set manifest.render.tailwindInput to a custom CSS entry file if needed.
+ * Set manifest.prerender.tailwindInput to a custom CSS entry file if needed.
  */
-function runTailwindCliForPrerender(rootDir, outputDir, ren) {
+function runTailwindCliForPrerender(rootDir, outputDir, pre) {
   if (!indexHtmlUsesTailwind(rootDir)) return false;
 
   const outCss = join(outputDir, 'prerender.tailwind.css');
@@ -944,7 +873,7 @@ function runTailwindCliForPrerender(rootDir, outputDir, ren) {
   }
   let inputPath = null;
   let createdTempInput = false;
-  const userInput = ren?.tailwindInput;
+  const userInput = pre?.tailwindInput;
   if (typeof userInput === 'string' && userInput.trim()) {
     inputPath = resolve(rootDir, userInput.trim());
   }
@@ -975,15 +904,10 @@ function runTailwindCliForPrerender(rootDir, outputDir, ren) {
   }
 
   process.stdout.write('prerender: compiling Tailwind CSS (this may take a minute)...\n');
-  // On Windows, invoke the .cmd shim directly instead of routing through
-  // `shell: true`. With `shell: true`, every argument (including the user-
-  // controlled `tailwindInput` path from manifest.json) gets parsed by cmd.exe
-  // — so a value like `styles.css & evilcmd` would run `evilcmd`. Calling
-  // npx.cmd directly keeps args as a literal argv with no shell interpretation.
-  const command = process.platform === 'win32' ? 'npx.cmd' : 'npx';
-  const r = spawnSync(command, args, {
+  const r = spawnSync('npx', args, {
     cwd: rootDir,
     encoding: 'utf8',
+    shell: process.platform === 'win32',
   });
   if (createdTempInput) {
     try {
@@ -993,7 +917,7 @@ function runTailwindCliForPrerender(rootDir, outputDir, ren) {
     }
   }
   if (r.status !== 0) {
-    console.error('prerender: Tailwind CLI failed; install with `npm i -D tailwindcss @tailwindcss/cli` or check tailwindInput in manifest.render.');
+    console.error('prerender: Tailwind CLI failed; install with `npm i -D tailwindcss @tailwindcss/cli` or check tailwindInput in manifest.prerender.');
     if (r.stderr) console.error(r.stderr);
     if (r.stdout) console.error(r.stdout);
     return false;
@@ -1299,7 +1223,8 @@ function stripPrerenderBakedRadioCheckedForXModel(html) {
 
 // --- Canonical and hreflang (per-page injection) ---
 
-function buildCanonicalAndHreflang(pathSeg, locales, defaultLocale, base) {
+function buildCanonicalAndHreflang(pathSeg, locales, defaultLocale, base, opts = {}) {
+  const { skipCanonical = false } = opts;
   const baseClean = base.replace(/\/$/, '');
   const defaultLoc = defaultLocale || locales[0];
   const isDefaultLocalePrefixed =
@@ -1312,7 +1237,10 @@ function buildCanonicalAndHreflang(pathSeg, locales, defaultLocale, base) {
       : pathSeg;
   const canonicalHref = canonicalPath === '' ? `${baseClean}/` : `${baseClean}/${canonicalPath}`;
   const esc = (s) => String(s).replace(/&/g, '&amp;').replace(/"/g, '&quot;');
-  let out = `<link rel="canonical" href="${esc(canonicalHref)}">\n`;
+  // Skip the canonical <link> when the source head already declares one
+  // (first-wins, per seo-aeo.md); hreflang alternates are still emitted since
+  // those are framework-derived and rarely authored by hand.
+  let out = skipCanonical ? '' : `<link rel="canonical" href="${esc(canonicalHref)}">\n`;
   if (locales.length > 1) {
     const currentLocale = locales.find((l) => pathSeg === l || pathSeg.startsWith(l + '/')) || defaultLoc;
     const logicalRoute =
@@ -1670,7 +1598,8 @@ function generateLocaleVariantHtml({
   html = rewriteHtmlAssetPaths(html, fileSegments.length);
 
   const liveBase = config.liveUrl.replace(/\/$/, '');
-  const canonicalHreflang = buildCanonicalAndHreflang(pathSeg, locales, defaultLocale, liveBase);
+  const hasSourceCanonical = /<link\b[^>]*\brel=(["'])\s*canonical\s*\1/i.test(html);
+  const canonicalHreflang = buildCanonicalAndHreflang(pathSeg, locales, defaultLocale, liveBase, { skipCanonical: hasSourceCanonical });
   const ogLocale = buildOgLocale(pathSeg, locales, defaultLocale);
   const injectOgLocale = ogLocale && hasOtherOgMeta(html);
   if (injectOgLocale) html = stripOgLocaleFromHead(html);
@@ -2472,29 +2401,123 @@ function routeHtmlPath(outputDir, pathSeg) {
 }
 
 /**
- * Best-effort per-route lastmod date.  We pick the prerendered HTML file's
- * mtime — that file IS regenerated on every prerender, so it's no better than
- * "today" for unchanged content.  Fallback hierarchy: 1) source markdown if
- * discoverable under articles/<path>.md; 2) prerendered HTML mtime; 3) today.
+ * Collect filesystem paths for all local-file data sources declared in
+ * `manifest.json` that are relevant to the given locale. Caller stats them.
+ *
+ * Skips remote sources (URLs, Appwrite databases / storage) since they have
+ * no local mtime. Locale-keyed JSON/YAML sources include only the matching
+ * locale's file. Multilingual CSVs (`locales` key) include every listed file
+ * because any column edit can affect the routed page.
+ */
+function collectDataSourceFiles(manifest, rootDir, effectiveLocale) {
+  const files = [];
+  const data = manifest?.data;
+  if (!data || typeof data !== 'object') return files;
+
+  const isLocaleKey = (key) =>
+    /^[a-z]{2,3}(?:-[A-Z][a-zA-Z]{1,7})?$/.test(key);
+
+  const localeMatches = (key) => {
+    if (!isLocaleKey(key)) return false;
+    if (effectiveLocale) return key === effectiveLocale;
+    // No locale context: include any locale-shaped key.
+    return true;
+  };
+
+  const isLocalPath = (s) => typeof s === 'string' && !/^https?:\/\//i.test(s);
+  const toAbs = (p) => join(rootDir, p.replace(/^\//, ''));
+
+  for (const value of Object.values(data)) {
+    // Plain string path → single locale-agnostic file.
+    if (isLocalPath(value)) {
+      files.push(toAbs(value));
+      continue;
+    }
+    if (!value || typeof value !== 'object') continue;
+    // Skip cloud / remote sources — they have no local file to stat.
+    if (value.url || value.appwriteDatabaseId || value.appwriteTableId || value.appwriteBucketId) continue;
+
+    for (const [key, v] of Object.entries(value)) {
+      // Multilingual CSV: { locales: "/p.csv" } or { locales: ["/a.csv", "/b.csv"] }
+      if (key === 'locales') {
+        if (isLocalPath(v)) files.push(toAbs(v));
+        else if (Array.isArray(v)) {
+          for (const p of v) if (isLocalPath(p)) files.push(toAbs(p));
+        }
+        continue;
+      }
+      // Colorpicker palette: { colorpicker: "/p.yaml" } or { colorpicker: { en: ..., fr: ... } }
+      if (key === 'colorpicker') {
+        if (isLocalPath(v)) files.push(toAbs(v));
+        else if (v && typeof v === 'object') {
+          for (const [k, p] of Object.entries(v)) {
+            if (localeMatches(k) && isLocalPath(p)) files.push(toAbs(p));
+          }
+        }
+        continue;
+      }
+      // Locale-keyed JSON/YAML: { en: "/p.en.json", fr: "/p.fr.json" }
+      if (localeMatches(key) && isLocalPath(v)) {
+        files.push(toAbs(v));
+      }
+    }
+  }
+
+  return files;
+}
+
+/**
+ * Best-effort per-route lastmod date. Takes the most recent mtime across:
+ *   1. Backing source-file conventions (markdown under articles/, pages/<path>.html)
+ *      so direct content edits are reflected.
+ *   2. Data-source files registered in `manifest.json` that are relevant to the
+ *      route's locale, so changes to JSON/YAML/CSV content driving the page
+ *      bump the date too (important for translated sites).
+ *
+ * Falls back to the prerendered HTML's own mtime only when nothing else is
+ * statable — the HTML mtime reflects rebuild time rather than content change
+ * time, so we prefer source/data mtimes when any exist.
  */
-function routeLastModDate(rootDir, outputDir, pathSeg) {
-  // Try common source-file conventions first so the date reflects content
-  // changes rather than the prerender run.  Strip leading section prefix
-  // ("docs/", "blog/", "articles/") since markdown files typically live
-  // under articles/ keyed by the remaining path.
-  const stripPrefix = pathSeg.replace(/^(?:docs|blog|articles|posts|guides)\//, '');
+function routeLastModDate(rootDir, outputDir, pathSeg, manifest, localeList, defaultLocale) {
+  // Detect a locale prefix on the path (e.g. "fr/about" → locale "fr",
+  // unlocalized "about"). For unprefixed paths in a multi-locale site we
+  // fall back to the default locale when matching data-source locale keys.
+  let locale = null;
+  let unlocalizedPath = pathSeg;
+  if (Array.isArray(localeList) && localeList.length) {
+    const first = pathSeg.split('/')[0];
+    if (localeList.includes(first)) {
+      locale = first;
+      unlocalizedPath = pathSeg.slice(first.length + 1);
+    }
+  }
+  const effectiveLocale = locale || defaultLocale || null;
+
+  // Source-file candidates from common conventions, keyed on the unlocalized
+  // path (markdown files typically aren't per-locale duplicates).
+  const stripPrefix = unlocalizedPath.replace(/^(?:docs|blog|articles|posts|guides)\//, '');
   const candidates = [
     join(rootDir, 'articles', `${stripPrefix}.md`),
-    join(rootDir, 'articles', `${pathSeg}.md`),
-    join(rootDir, 'pages', `${pathSeg}.html`),
-    join(rootDir, `${pathSeg}.md`),
+    join(rootDir, 'articles', `${unlocalizedPath}.md`),
+    join(rootDir, 'pages', `${unlocalizedPath}.html`),
+    join(rootDir, `${unlocalizedPath}.md`),
   ];
+
+  // Add data-source files relevant to this locale.
+  if (manifest) {
+    candidates.push(...collectDataSourceFiles(manifest, rootDir, effectiveLocale));
+  }
+
+  // Take the max mtime across all source / data candidates.
+  let latest = null;
   for (const c of candidates) {
     try {
       const s = statSync(c);
-      if (s.isFile()) return s.mtime.toISOString().slice(0, 10);
+      if (s.isFile() && (!latest || s.mtime > latest)) latest = s.mtime;
     } catch { /* not found */ }
   }
+  if (latest) return latest.toISOString().slice(0, 10);
+
   // Fallback to the prerendered output mtime (always present).
   try {
     const out = routeHtmlPath(outputDir, pathSeg || '');
@@ -2509,6 +2532,7 @@ function writeSeoFiles(outputDir, pathList, liveUrl, locales, defaultLocale, ctx
   const localeList = Array.isArray(locales) ? locales : [];
   const multiLocale = localeList.length > 1;
   const rootDir = ctx.rootDir || '';
+  const manifest = ctx.manifest || null;
 
   writeFileSync(
     join(outputDir, 'robots.txt'),
@@ -2534,7 +2558,7 @@ Sitemap: ${base}/sitemap.xml
         body += `\n        <xhtml:link rel="alternate" hreflang="${escapeXmlText(hreflang)}" href="${escapeXmlText(href)}" />`;
       }
     }
-    const lastmod = routeLastModDate(rootDir, outputDir, pathSeg);
+    const lastmod = routeLastModDate(rootDir, outputDir, pathSeg, manifest, localeList, defaultLocale);
     body += `\n        <lastmod>${lastmod}</lastmod>
         <changefreq>monthly</changefreq>
         <priority>${path === '' ? '1.0' : '0.8'}</priority>`;
@@ -2805,6 +2829,42 @@ function copyProjectIntoDist(rootResolved, outputResolved) {
   COPY_EXCLUDE.delete(outputDirName);
 }
 
+/** Remove bare `@import "tailwindcss"` (and `tailwindcss/*` sub-imports) from
+ * CSS files copied into the output.
+ *
+ * Tailwind v4 conventions put `@import "tailwindcss";` at the top of a
+ * project's main CSS so the build tool pulls in the framework.  When that same
+ * file is also linked directly in the browser (as Manifest's
+ * `manifest.theme.css` convention does), the browser's native CSS loader
+ * resolves the bare specifier against the page origin and fetches
+ * `/tailwindcss` — which 404s to the SPA shell (text/html), tripping
+ * "Refused to apply style … is not a supported stylesheet MIME type" (flagged
+ * by PageSpeed Best Practices).  Manifest supplies Tailwind its own way
+ * (compiled `prerender.tailwind.css` for MPA, the Play-CDN style engine for
+ * SPA), so a raw import in a browser-served stylesheet is always redundant and
+ * harmful.  Strip it from the emitted copies only; source files are untouched. */
+function stripTailwindCssImportsFromOutput(outputDir) {
+  const importRx = /@import\s+(?:url\(\s*)?["']tailwindcss(?:\/[^"']*)?["']\s*\)?[^;\n]*;?[ \t]*\r?\n?/gi;
+  const walk = (dir) => {
+    for (const ent of readdirSync(dir, { withFileTypes: true })) {
+      if (ent.name.startsWith('.')) continue;
+      const p = join(dir, ent.name);
+      if (ent.isDirectory()) {
+        if (ent.name === 'node_modules') continue;
+        walk(p);
+      } else if (ent.name.endsWith('.css') && ent.name !== 'prerender.tailwind.css') {
+        try {
+          const css = readFileSync(p, 'utf8');
+          if (!/tailwindcss/i.test(css)) continue;
+          const next = css.replace(importRx, '');
+          if (next !== css) writeFileSync(p, next, 'utf8');
+        } catch { /* unreadable file — skip */ }
+      }
+    }
+  };
+  walk(outputDir);
+}
+
 // --- Main --------------------------------------------------------------------
 
 async function main() {
@@ -2847,7 +2907,7 @@ async function runPrerender(config) {
 
   const defaultLocale = locales[0] ?? null;
   const routeSegments = discoverRoutes(manifest, config.root);
-  // Merge any explicitly configured paths (manifest.render.paths) into the discovered segments.
+  // Merge any explicitly configured paths (manifest.prerender.paths) into the discovered segments.
   // These are treated as locale-neutral and get full locale-expansion like all other discovered paths.
   if (config.paths && config.paths.length > 0) {
     const segSet = new Set(routeSegments);
@@ -2894,7 +2954,7 @@ async function runPrerender(config) {
   const outputResolved = resolve(config.output);
   const rootResolved = resolve(config.root);
   // Router base = URL pathname to the app root. When dist is deployed as site root (e.g. Appwrite), use "".
-  // Set manifest.render.routerBase only when the app is served from a subpath (e.g. /app).
+  // Set manifest.prerender.routerBase only when the app is served from a subpath (e.g. /app).
   let routerBasePath = null;
   if (config.routerBase != null && String(config.routerBase).trim() !== '') {
     const trimmed = String(config.routerBase).replace(/^\/+|\/+$/g, '').trim();
@@ -2908,10 +2968,18 @@ async function runPrerender(config) {
   }
   mkdirSync(outputResolved, { recursive: true });
   copyProjectIntoDist(rootResolved, outputResolved);
+  // Projects that use data-tailwind get their Tailwind from Manifest (compiled
+  // prerender.tailwind.css below, or the runtime style engine).  A leftover
+  // `@import "tailwindcss"` in a browser-linked stylesheet (e.g. the
+  // manifest.theme.css convention) would make the browser fetch /tailwindcss
+  // and fail; strip those imports from the copied CSS.
+  if (indexHtmlUsesTailwind(rootResolved)) {
+    stripTailwindCssImportsFromOutput(outputResolved);
+  }
 
-  const ren = manifest.render ?? {};
-  const bundleUtilities = ren.utilitiesBundle !== false;
-  const tailwindBuilt = runTailwindCliForPrerender(rootResolved, outputResolved, ren);
+  const pre = manifest.prerender ?? {};
+  const bundleUtilities = pre.utilitiesBundle !== false;
+  const tailwindBuilt = runTailwindCliForPrerender(rootResolved, outputResolved, pre);
   const utilityBlocks = [];
 
   // Launch a fresh browser instance.  Chromium is known to accumulate memory
@@ -2943,18 +3011,12 @@ async function runPrerender(config) {
         console.error('  npm i -D puppeteer-core @sparticuz/chromium');
         process.exit(1);
       }
-      // Chrome's sandbox is the primary defense against renderer-process
-      // exploits — disabling it means any RCE in a rendered page runs as the
-      // developer's UID with full filesystem access. We render arbitrary CDN
-      // scripts and third-party iframes, so the threat is real. Opt-in only
-      // for CI environments where the sandbox legitimately can't initialize:
-      // set MNFST_RENDER_NO_SANDBOX=1 to add the flags back.
-      const extraArgs = process.env.MNFST_RENDER_NO_SANDBOX === '1'
-        ? ['--no-sandbox', '--disable-setuid-sandbox']
-        : [];
       return await puppeteer.default.launch({
         headless: true,
-        args: extraArgs,
+        args: [
+          '--no-sandbox',
+          '--disable-setuid-sandbox',
+        ],
       });
     }
   }
@@ -2965,12 +3027,12 @@ async function runPrerender(config) {
   // substantial, and we also now maintain a per-page source-attribute Map for
   // the hydration contract.  On large sites (>100 routes) higher concurrency
   // spikes memory and crashes the browser.  Users can still override via
-  // --concurrency or manifest.render.concurrency.
+  // --concurrency or manifest.prerender.concurrency.
   const concurrency = config.concurrency;
   const maxRetries = config.retries ?? 2;
   // Recycle the browser every N processed pages to bound resource growth.
-  // Configurable via manifest.render.browserRecycleEvery.
-  const browserRecycleEvery = Math.max(0, ren.browserRecycleEvery ?? 40);
+  // Configurable via manifest.prerender.browserRecycleEvery.
+  const browserRecycleEvery = Math.max(0, pre.browserRecycleEvery ?? 40);
   let pagesSinceRecycle = 0;
   const recycleLock = { busy: false };
   // Workers block on this promise before touching `browser`.  While a recycle
@@ -3848,11 +3910,20 @@ async function runPrerender(config) {
       await page.evaluate(() => {
         const A = window.Alpine;
         const runBatch = typeof A?.mutateDom === 'function' ? (fn) => A.mutateDom(fn) : (fn) => fn();
-        const loopVarRegex = /^\s*(?:\(\s*([A-Za-z_$][\w$]*)(?:\s*,\s*([A-Za-z_$][\w$]*))?\s*\)|([A-Za-z_$][\w$]*))\s+in\s+/;
+        // Collect every loop-scope identifier from the x-for LHS, including
+        // destructuring forms — `item`, `(item, index)`, `[key, val]`,
+        // `{ a, b }`.  The old single/paren-only regex skipped destructured
+        // loops entirely, leaving bindings like x-text="file?.label" on baked
+        // clones; at runtime Alpine evaluated them outside the iteration scope
+        // and threw "file is not defined".
+        const extractLoopVars = (xForExpr) => {
+          const m = String(xForExpr || '').match(/^([\s\S]*?)\s+(?:in|of)\s+/);
+          return m ? (m[1].match(/[A-Za-z_$][\w$]*/g) || []) : [];
+        };
         // Include x-init: expanded clones still had x-init="getDescription(article)" etc.; Alpine then throws (article undefined).
         const bindingAttrRegex = /^(?:x-bind:|:|x-text|x-html|x-show|x-if|x-model|x-effect|x-init|x-icon|x-on:|@)/;
         const hasVar = (expr, varName) => varName && new RegExp(`\\b${varName}\\b`).test(expr || '');
-        const stripLoopBindings = (el, itemVar, indexVar) => {
+        const stripLoopBindings = (el, loopVars) => {
           const nodes = [el, ...Array.from(el.querySelectorAll('*'))];
           for (const node of nodes) {
             // Skip elements inside data-hydrate islands — their bindings must remain live
@@ -3861,7 +3932,7 @@ async function runPrerender(config) {
             for (const attr of attrs) {
               if (!bindingAttrRegex.test(attr.name)) continue;
               const expr = attr.value || '';
-              if (hasVar(expr, itemVar) || hasVar(expr, indexVar)) {
+              if (loopVars.some((v) => hasVar(expr, v))) {
                 const name = attr.name;
                 if (name === 'x-text' || name === 'x-html') {
                   if ((node.textContent || '').trim() || (node.innerHTML || '').trim()) {
@@ -3903,10 +3974,8 @@ async function runPrerender(config) {
           document.querySelectorAll('template[x-for]').forEach((tpl) => {
             if (tpl.hasAttribute('data-hydrate') || tpl.closest('[data-hydrate]')) return;
             const xFor = (tpl.getAttribute('x-for') || '').trim();
-            const m = xFor.match(loopVarRegex);
-            const itemVar = m ? (m[1] || m[3] || '') : '';
-            const indexVar = m ? (m[2] || '') : '';
-            if (!itemVar && !indexVar) return;
+            const loopVars = extractLoopVars(xFor);
+            if (!loopVars.length) return;
 
             const first = tpl.content?.firstElementChild;
             if (!first) return;
@@ -3915,7 +3984,7 @@ async function runPrerender(config) {
             let next = tpl.nextElementSibling;
             while (next) {
               if (next.tagName !== tag) break;
-              stripLoopBindings(next, itemVar, indexVar);
+              stripLoopBindings(next, loopVars);
               next = next.nextElementSibling;
             }
           });
@@ -4009,10 +4078,13 @@ async function runPrerender(config) {
       // Remove orphan x-for clones that still reference loop-scope vars (e.g. image/index)
       // outside their template scope. These throw Alpine errors in live static hosting.
       await page.evaluate(() => {
-        const loopVarRegex = /^\s*(?:\(\s*([A-Za-z_$][\w$]*)(?:\s*,\s*([A-Za-z_$][\w$]*))?\s*\)|([A-Za-z_$][\w$]*))\s+in\s+/;
+        const extractLoopVars = (xForExpr) => {
+          const m = String(xForExpr || '').match(/^([\s\S]*?)\s+(?:in|of)\s+/);
+          return m ? (m[1].match(/[A-Za-z_$][\w$]*/g) || []) : [];
+        };
         const bindingAttrRegex = /^(?:x-bind:|:|x-text|x-html|x-show|x-if|x-model|x-effect|x-init|x-icon|x-on:|@)/;
         const hasVar = (expr, varName) => varName && new RegExp(`\\b${varName}\\b`).test(expr || '');
-        const elementReferencesLoopScope = (el, itemVar, indexVar) => {
+        const elementReferencesLoopScope = (el, loopVars) => {
           if (!el) return false;
           const nodes = [el, ...Array.from(el.querySelectorAll('*'))];
           for (const node of nodes) {
@@ -4020,7 +4092,7 @@ async function runPrerender(config) {
             for (const attr of attrs) {
               if (!bindingAttrRegex.test(attr.name)) continue;
               const expr = attr.value || '';
-              if (hasVar(expr, itemVar) || hasVar(expr, indexVar)) return true;
+              if (loopVars.some((v) => hasVar(expr, v))) return true;
             }
           }
           return false;
@@ -4030,10 +4102,8 @@ async function runPrerender(config) {
         // Running this on all x-for templates can remove valid prerendered list items.
         document.querySelectorAll('template[x-for][data-prerender-collapsed="1"]').forEach((tpl) => {
           const xFor = (tpl.getAttribute('x-for') || '').trim();
-          const m = xFor.match(loopVarRegex);
-          const itemVar = m ? (m[1] || m[3] || '') : '';
-          const indexVar = m ? (m[2] || '') : '';
-          if (!itemVar && !indexVar) return;
+          const loopVars = extractLoopVars(xFor);
+          if (!loopVars.length) return;
 
           const first = tpl.content?.firstElementChild;
           if (!first) return;
@@ -4044,7 +4114,7 @@ async function runPrerender(config) {
             const sameTag = next.tagName === tag;
             if (!sameTag) break;
 
-            const referencesLoopScope = elementReferencesLoopScope(next, itemVar, indexVar);
+            const referencesLoopScope = elementReferencesLoopScope(next, loopVars);
 
             const toRemove = next;
             next = next.nextElementSibling;
@@ -4167,7 +4237,8 @@ async function runPrerender(config) {
 
       html = rewriteHtmlAssetPaths(html, fileSegments.length);
       const liveBase = config.liveUrl.replace(/\/$/, '');
-      const canonicalHreflang = buildCanonicalAndHreflang(is404 ? '' : pathSeg, locales, defaultLocale, liveBase);
+      const hasSourceCanonical = /<link\b[^>]*\brel=(["'])\s*canonical\s*\1/i.test(html);
+      const canonicalHreflang = buildCanonicalAndHreflang(is404 ? '' : pathSeg, locales, defaultLocale, liveBase, { skipCanonical: hasSourceCanonical });
       const ogLocale = buildOgLocale(is404 ? '' : pathSeg, locales, defaultLocale);
       const injectOgLocale = ogLocale && hasOtherOgMeta(html);
       if (injectOgLocale) html = stripOgLocaleFromHead(html);
@@ -4189,6 +4260,7 @@ async function runPrerender(config) {
       );
       // (Hydration contract was already injected into the raw HTML before
       // the Node.js post-processing pipeline ran, so it's already present.)
+      html = ensureDoctype(html);
       mkdirSync(outDir, { recursive: true });
       writeFileSync(outFile, html, 'utf8');
       pushDebug({
@@ -4371,7 +4443,7 @@ async function runPrerender(config) {
         const fileSegments = pathToFileSegments(pathSeg ? '/' + pathSeg : '/');
         const outDir = join(config.output, ...fileSegments);
         mkdirSync(outDir, { recursive: true });
-        writeFileSync(join(outDir, 'index.html'), html, 'utf8');
+        writeFileSync(join(outDir, 'index.html'), ensureDoctype(html), 'utf8');
       } catch (err) {
         failedPaths.push({ path: displayPath, message: err?.message ?? String(err) });
         process.stderr.write(`prerender: substitution failed ${displayPath}: ${failedPaths[failedPaths.length - 1].message}\n`);
@@ -4412,6 +4484,7 @@ async function runPrerender(config) {
     defaultLocale,
     {
       rootDir: config.root,
+      manifest: config.manifest,
       siteName: config.seo?.siteName,
       siteDescription: config.seo?.siteDescription,
     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "mnfst-render",
-  "version": "0.5.25",
+  "version": "0.5.27",
   "description": "Render Manifest sites to static HTML for SEO",
   "type": "module",
   "bin": {