nuxt-og-image 5.1.13 → 6.0.0-beta.2

package/dist/cli.cjs

@@ -0,0 +1,433 @@
+#!/usr/bin/env node
+'use strict';
+
+const fs = require('node:fs');
+const node_path = require('node:path');
+const node_url = require('node:url');
+const p = require('@clack/prompts');
+const magicast = require('magicast');
+const nypm = require('nypm');
+
+var _documentCurrentScript = typeof document !== 'undefined' ? document.currentScript : null;
+function _interopNamespaceCompat(e) {
+  if (e && typeof e === 'object' && 'default' in e) return e;
+  const n = Object.create(null);
+  if (e) {
+    for (const k in e) {
+      n[k] = e[k];
+    }
+  }
+  n.default = e;
+  return n;
+}
+
+const p__namespace = /*#__PURE__*/_interopNamespaceCompat(p);
+
+const __dirname$1 = node_path.dirname(node_url.fileURLToPath((typeof document === 'undefined' ? require('u' + 'rl').pathToFileURL(__filename).href : (_documentCurrentScript && _documentCurrentScript.tagName.toUpperCase() === 'SCRIPT' && _documentCurrentScript.src || new URL('cli.cjs', document.baseURI).href))));
+const communityDir = node_path.resolve(__dirname$1, "runtime/app/components/Templates/Community");
+const defaultComponentDirs = ["OgImage", "OgImageCommunity", "og-image", "OgImageTemplate"];
+const RENDERERS = [
+  {
+    name: "satori",
+    label: "Satori",
+    description: "SVG-based renderer - fast, works everywhere (recommended)",
+    deps: ["satori", "@resvg/resvg-js"]
+  },
+  {
+    name: "takumi",
+    label: "Takumi",
+    description: "Rust-based high-performance renderer",
+    deps: ["@takumi-rs/core"]
+  },
+  {
+    name: "chromium",
+    label: "Chromium",
+    description: "Browser screenshot renderer - pixel-perfect but slower",
+    deps: ["playwright-core"]
+  }
+];
+function getBaseName(filename) {
+  return filename.replace(/\.(satori|chromium|takumi)\.vue$/, "");
+}
+function hasRendererSuffix(filename) {
+  return /\.(?:satori|chromium|takumi)\.vue$/.test(filename);
+}
+function listTemplates() {
+  const templates = fs.readdirSync(communityDir).filter((f) => f.endsWith(".vue")).map(getBaseName);
+  console.log("\nAvailable community templates:");
+  templates.forEach((t) => console.log(`  - ${t}`));
+  console.log("\nUsage: npx nuxt-og-image eject <template-name>\n");
+}
+function findTemplateFile(name) {
+  const files = fs.readdirSync(communityDir).filter((f) => f.endsWith(".vue"));
+  const match = files.find((f) => getBaseName(f) === name);
+  return match || null;
+}
+function ejectTemplate(name, targetDir) {
+  const templateFile = findTemplateFile(name);
+  if (!templateFile) {
+    p__namespace.log.error(`Template "${name}" not found.`);
+    listTemplates();
+    process.exit(1);
+  }
+  const templatePath = node_path.join(communityDir, templateFile);
+  const outputDir = node_path.resolve(targetDir, "components", "OgImage");
+  if (!fs.existsSync(outputDir))
+    fs.mkdirSync(outputDir, { recursive: true });
+  const outputPath = node_path.join(outputDir, templateFile);
+  if (fs.existsSync(outputPath)) {
+    p__namespace.log.error(`File already exists: ${outputPath}`);
+    process.exit(1);
+  }
+  const content = fs.readFileSync(templatePath, "utf-8");
+  fs.writeFileSync(outputPath, content, "utf-8");
+  p__namespace.log.success(`Ejected "${name}" to ${outputPath}`);
+}
+function findOgImageComponents(dir) {
+  const components = [];
+  for (const componentDir of defaultComponentDirs) {
+    const ogImageDir = node_path.join(dir, "components", componentDir);
+    if (fs.existsSync(ogImageDir)) {
+      const files = fs.readdirSync(ogImageDir, { withFileTypes: true });
+      for (const file of files) {
+        if (file.isFile() && file.name.endsWith(".vue"))
+          components.push(node_path.join(ogImageDir, file.name));
+      }
+    }
+  }
+  return components;
+}
+function globFiles(dir, pattern, exclude = []) {
+  const results = [];
+  function walk(currentDir) {
+    if (!fs.existsSync(currentDir))
+      return;
+    const entries = fs.readdirSync(currentDir, { withFileTypes: true });
+    for (const entry of entries) {
+      const fullPath = node_path.join(currentDir, entry.name);
+      if (exclude.some((re) => re.test(fullPath)))
+        continue;
+      if (entry.isDirectory()) {
+        walk(fullPath);
+      } else if (entry.isFile() && pattern.test(entry.name)) {
+        results.push(fullPath);
+      }
+    }
+  }
+  walk(dir);
+  return results;
+}
+async function checkNuxtConfig(rootDir) {
+  const configPaths = ["nuxt.config.ts", "nuxt.config.js", "nuxt.config.mjs"];
+  let configPath = null;
+  for (const _p of configPaths) {
+    const fullPath = node_path.join(rootDir, _p);
+    if (fs.existsSync(fullPath)) {
+      configPath = fullPath;
+      break;
+    }
+  }
+  if (!configPath)
+    return { hasDeprecatedFonts: false, hasNuxtFonts: false, configPath: null };
+  const mod = await magicast.loadFile(configPath).catch(() => null);
+  if (!mod)
+    return { hasDeprecatedFonts: false, hasNuxtFonts: false, configPath };
+  const config = mod.exports.default;
+  const hasDeprecatedFonts = !!config?.ogImage?.fonts;
+  const modules = config?.modules || [];
+  const hasNuxtFonts = modules.some(
+    (m) => typeof m === "string" && m === "@nuxt/fonts" || Array.isArray(m) && m[0] === "@nuxt/fonts"
+  );
+  return { hasDeprecatedFonts, hasNuxtFonts, configPath };
+}
+async function checkMigrationNeeded(rootDir) {
+  const result = {
+    needsComponentRename: false,
+    needsFontsMigration: false,
+    needsNuxtFonts: false,
+    componentsToRename: []
+  };
+  const dirs = [rootDir];
+  if (fs.existsSync(node_path.join(rootDir, "app")))
+    dirs.push(node_path.join(rootDir, "app"));
+  const layersDir = node_path.join(rootDir, "layers");
+  if (fs.existsSync(layersDir)) {
+    const layerDirs = fs.readdirSync(layersDir, { withFileTypes: true }).filter((d) => d.isDirectory()).map((d) => node_path.join(layersDir, d.name));
+    dirs.push(...layerDirs);
+  }
+  for (const dir of dirs) {
+    const components = findOgImageComponents(dir);
+    for (const filepath of components) {
+      const filename = filepath.split("/").pop();
+      if (!hasRendererSuffix(filename)) {
+        result.componentsToRename.push({ from: filepath, to: "" });
+      }
+    }
+  }
+  result.needsComponentRename = result.componentsToRename.length > 0;
+  const configCheck = await checkNuxtConfig(rootDir);
+  result.needsFontsMigration = configCheck.hasDeprecatedFonts;
+  result.needsNuxtFonts = !configCheck.hasNuxtFonts;
+  return result;
+}
+function migrateDefineOgImageApi(dryRun) {
+  const cwd = process.cwd();
+  const excludePatterns = [/node_modules/, /\.nuxt/, /\.output/, /dist/];
+  const files = globFiles(cwd, /\.(?:vue|ts|tsx|js|jsx)$/, excludePatterns);
+  const changes = [];
+  for (const file of files) {
+    let content = fs.readFileSync(file, "utf-8");
+    let modified = false;
+    let changeCount = 0;
+    if (/defineOgImageComponent\s*\(/.test(content)) {
+      content = content.replace(/defineOgImageComponent\s*\(/g, "defineOgImage(");
+      modified = true;
+      changeCount++;
+    }
+    const defineOgImageRegex = /defineOgImage\s*\(\s*(\{[\s\S]*?\})\s*\)/g;
+    content = content.replace(defineOgImageRegex, (match, inner) => {
+      const componentMatch = inner.match(/component\s*:\s*['"]([^'"]+)['"]/);
+      const rendererMatch = inner.match(/renderer\s*:\s*['"]([^'"]+)['"]/);
+      const propsMatch = inner.match(/props\s*:\s*(\{[^}]*\})/);
+      if (!componentMatch && rendererMatch && rendererMatch[1] === "chromium") {
+        const remaining = inner.replace(/renderer\s*:\s*['"][^'"]+['"]\s*,?\s*/g, "").replace(/,\s*$/, "").trim();
+        modified = true;
+        changeCount++;
+        return remaining ? `defineOgImageScreenshot({ ${remaining} })` : `defineOgImageScreenshot()`;
+      }
+      if (componentMatch || rendererMatch) {
+        const componentName = componentMatch ? componentMatch[1] : "NuxtSeo";
+        const props = propsMatch ? propsMatch[1] : "{}";
+        const otherOptions = [];
+        const lines = inner.split(/,(?![^{]*\})/).map((s) => s.trim());
+        for (const line of lines) {
+          if (!line)
+            continue;
+          if (/^component\s*:/.test(line))
+            continue;
+          if (/^props\s*:/.test(line))
+            continue;
+          if (/^renderer\s*:/.test(line))
+            continue;
+          otherOptions.push(line);
+        }
+        modified = true;
+        changeCount++;
+        if (otherOptions.length > 0) {
+          return `defineOgImage('${componentName}', ${props}, { ${otherOptions.join(", ")} })`;
+        }
+        return `defineOgImage('${componentName}', ${props})`;
+      }
+      return match;
+    });
+    if (modified) {
+      changes.push({ file, count: changeCount });
+      if (!dryRun) {
+        fs.writeFileSync(file, content, "utf-8");
+      }
+    }
+  }
+  return { changes };
+}
+function migrateV6Components(componentsToRename, defaultRenderer, dryRun) {
+  for (const item of componentsToRename) {
+    const filename = item.from.split("/").pop();
+    const newName = filename.replace(".vue", `.${defaultRenderer}.vue`);
+    item.to = item.from.replace(filename, newName);
+  }
+  if (dryRun) {
+    console.log("\nWould rename:");
+    for (const { from, to } of componentsToRename) {
+      console.log(`  ${from.split("/").pop()} \u2192 ${to.split("/").pop()}`);
+    }
+    return;
+  }
+  for (const { from, to } of componentsToRename) {
+    fs.renameSync(from, to);
+    console.log(`\u2713 Renamed ${from.split("/").pop()}`);
+  }
+}
+async function installRendererDeps(renderers) {
+  const cwd = process.cwd();
+  const pm = await nypm.detectPackageManager(cwd);
+  const pmName = pm?.name || "npm";
+  const allDeps = [];
+  for (const renderer of renderers) {
+    const def = RENDERERS.find((r) => r.name === renderer);
+    if (def) {
+      allDeps.push(...def.deps);
+    }
+  }
+  if (allDeps.length === 0)
+    return;
+  const spinner = p__namespace.spinner();
+  spinner.start(`Installing dependencies with ${pmName}...`);
+  for (const dep of allDeps) {
+    await nypm.addDependency(dep, { cwd, dev: false }).catch(() => {
+      spinner.stop(`Failed to install ${dep}`);
+      p__namespace.log.warn(`Run manually: ${pmName} add ${dep}`);
+    });
+  }
+  spinner.stop("Dependencies installed");
+}
+async function installNuxtFonts() {
+  const cwd = process.cwd();
+  const spinner = p__namespace.spinner();
+  spinner.start("Adding @nuxt/fonts module...");
+  const { execa } = await import('execa');
+  await execa("npx", ["nuxi", "module", "add", "@nuxt/fonts"], { cwd }).then(() => {
+    spinner.stop("@nuxt/fonts module added");
+  }).catch(() => {
+    spinner.stop("Failed to add @nuxt/fonts");
+    p__namespace.log.warn("Run manually: npx nuxi module add @nuxt/fonts");
+  });
+}
+async function runMigrate(args2) {
+  const dryRun = args2.includes("--dry-run") || args2.includes("-d");
+  const skipConfirm = args2.includes("--yes") || args2.includes("-y");
+  const rendererIdx = args2.indexOf("--renderer");
+  const cliRenderer = rendererIdx !== -1 ? args2[rendererIdx + 1] : null;
+  if (cliRenderer && !["satori", "chromium", "takumi"].includes(cliRenderer)) {
+    console.error(`Invalid renderer: ${cliRenderer}. Must be satori, chromium, or takumi.`);
+    process.exit(1);
+  }
+  p__namespace.intro("nuxt-og-image v6 Migration");
+  const cwd = process.cwd();
+  const migrationCheck = await checkMigrationNeeded(cwd);
+  const noComponentWork = !migrationCheck.needsComponentRename;
+  const noFontsWork = !migrationCheck.needsFontsMigration && !migrationCheck.needsNuxtFonts;
+  if (noComponentWork && noFontsWork) {
+    console.log("\u2713 All OG Image components already have renderer suffixes.");
+    p__namespace.outro("Done");
+    return;
+  }
+  const tasks = [];
+  if (migrationCheck.needsComponentRename) {
+    tasks.push(`Rename ${migrationCheck.componentsToRename.length} component(s) to include renderer suffix`);
+  }
+  if (migrationCheck.needsFontsMigration) {
+    tasks.push("Migrate ogImage.fonts to @nuxt/fonts config");
+  }
+  if (migrationCheck.needsNuxtFonts) {
+    tasks.push("Install @nuxt/fonts module");
+  }
+  tasks.push("Update defineOgImage() calls to new API");
+  p__namespace.note(tasks.map((t) => `\u2022 ${t}`).join("\n"), "Migration tasks");
+  if (dryRun) {
+    p__namespace.log.warn("[Dry run mode - no changes will be made]");
+  }
+  let selectedRenderers;
+  if (skipConfirm) {
+    selectedRenderers = cliRenderer ? [cliRenderer] : ["satori"];
+  } else {
+    const confirmed = await p__namespace.confirm({
+      message: "This will modify files. Continue?",
+      initialValue: false
+    });
+    if (p__namespace.isCancel(confirmed) || !confirmed) {
+      p__namespace.cancel("Migration cancelled");
+      process.exit(0);
+    }
+    const rendererSelection = await p__namespace.multiselect({
+      message: "Which renderers do you want to use?",
+      options: RENDERERS.map((r) => ({
+        value: r.name,
+        label: r.label,
+        hint: r.description
+      })),
+      initialValues: ["satori"],
+      required: true
+    });
+    if (p__namespace.isCancel(rendererSelection)) {
+      p__namespace.cancel("Migration cancelled");
+      process.exit(0);
+    }
+    selectedRenderers = rendererSelection;
+    if (!dryRun) {
+      const installDeps = await p__namespace.confirm({
+        message: "Install renderer dependencies?",
+        initialValue: true
+      });
+      if (!p__namespace.isCancel(installDeps) && installDeps) {
+        await installRendererDeps(selectedRenderers);
+      }
+    }
+  }
+  if (migrationCheck.needsComponentRename) {
+    console.log("\nRenaming components...");
+    migrateV6Components(migrationCheck.componentsToRename, selectedRenderers[0] || "satori", dryRun);
+  }
+  console.log("\nMigrating defineOgImage calls...");
+  const apiChanges = migrateDefineOgImageApi(dryRun);
+  if (apiChanges.changes.length > 0) {
+    for (const { file, count } of apiChanges.changes) {
+      const relPath = file.replace(`${cwd}/`, "");
+      console.log(`  ${relPath} (${count} change${count > 1 ? "s" : ""})`);
+    }
+  } else {
+    console.log("  No API changes needed");
+  }
+  if (migrationCheck.needsNuxtFonts && !dryRun && !skipConfirm) {
+    const addFonts = await p__namespace.confirm({
+      message: "@nuxt/fonts is recommended for custom fonts. Add it?",
+      initialValue: true
+    });
+    if (!p__namespace.isCancel(addFonts) && addFonts) {
+      await installNuxtFonts();
+    }
+  }
+  if (dryRun) {
+    console.log("\n[Dry run - no changes made]");
+    console.log("Run without --dry-run to apply changes.");
+  }
+  p__namespace.outro(dryRun ? "Dry run complete" : "Migration complete!");
+}
+async function runEnable(renderer) {
+  const def = RENDERERS.find((r) => r.name === renderer);
+  if (!def) {
+    p__namespace.log.error(`Unknown renderer: ${renderer}`);
+    p__namespace.log.info(`Available: ${RENDERERS.map((r) => r.name).join(", ")}`);
+    process.exit(1);
+  }
+  p__namespace.intro(`Enable ${def.label} renderer`);
+  await installRendererDeps([renderer]);
+  p__namespace.outro("Done");
+}
+const args = process.argv.slice(2);
+const command = args[0];
+if (command === "eject") {
+  const templateName = args[1];
+  if (!templateName) {
+    p__namespace.log.error("Please specify a template name.");
+    listTemplates();
+    process.exit(1);
+  }
+  const cwd = process.cwd();
+  const targetDir = fs.existsSync(node_path.join(cwd, "app")) ? node_path.join(cwd, "app") : cwd;
+  ejectTemplate(templateName, targetDir);
+} else if (command === "list") {
+  listTemplates();
+} else if (command === "migrate") {
+  const version = args[1];
+  if (version !== "v6") {
+    p__namespace.log.error("Usage: npx nuxt-og-image migrate v6 [--dry-run] [--yes] [--renderer <satori|chromium|takumi>]");
+    process.exit(1);
+  }
+  runMigrate(args);
+} else if (command === "enable") {
+  const renderer = args[1];
+  if (!renderer) {
+    p__namespace.log.error("Usage: npx nuxt-og-image enable <renderer>");
+    p__namespace.log.info(`Available: ${RENDERERS.map((r) => r.name).join(", ")}`);
+    process.exit(1);
+  }
+  runEnable(renderer);
+} else {
+  console.log("nuxt-og-image CLI\n");
+  console.log("Commands:");
+  console.log("  list              List available community templates");
+  console.log("  eject <name>      Eject a community template to your project");
+  console.log("  migrate v6        Migrate to v6 (component suffixes + new API)");
+  console.log("                    Options: --dry-run, --yes, --renderer <satori|chromium|takumi>");
+  console.log("  enable <renderer> Install dependencies for a renderer (satori, chromium, takumi)");
+}

package/dist/cli.d.cts

@@ -0,0 +1 @@
+

package/dist/cli.d.mts

@@ -0,0 +1 @@
+

package/dist/cli.d.ts

@@ -0,0 +1 @@
+