slidev-workspace 0.5.2 → 0.6.1

package/dist/cli.js

@@ -2,7 +2,7 @@
 import { fileURLToPath } from "node:url";
 import { dirname, join, resolve } from "node:path";
 import { existsSync, mkdirSync, readdirSync } from "node:fs";
-import { cp } from "node:fs/promises";
+import { cp, rm } from "node:fs/promises";
 import { execSync } from "node:child_process";
 import { build, createServer } from "vite";
 import vue from "@vitejs/plugin-vue";
@@ -365,6 +365,46 @@ async function buildAllSlides() {
 		}
 	}
 }
+async function exportOgImages() {
+	const workspaceCwd = process.env.SLIDEV_WORKSPACE_CWD || process.cwd();
+	const config = loadConfig(workspaceCwd);
+	const slidesDirs = resolveSlidesDirs(config, workspaceCwd);
+	console.log("🖼️ Exporting OG images for all slides...");
+	try {
+		execSync("pnpm -r export --format png --range 1", {
+			cwd: workspaceCwd,
+			stdio: "inherit"
+		});
+		console.log("📦 Copying exported images to og-image.png...");
+		for (const slidesDir of slidesDirs) {
+			if (!existsSync(slidesDir)) {
+				console.warn(`⚠️ Slides directory not found: ${slidesDir}`);
+				continue;
+			}
+			const slides = readdirSync(slidesDir, { withFileTypes: true }).filter((dirent) => dirent.isDirectory()).map((dirent) => dirent.name);
+			for (const slideName of slides) {
+				const slideDir = join(slidesDir, slideName);
+				const packageJsonPath = join(slideDir, "package.json");
+				if (!existsSync(packageJsonPath)) continue;
+				const exportedFile = join(slideDir, "slides-export", "1.png");
+				const targetFile = join(slideDir, "og-image.png");
+				const exportDir = join(slideDir, "slides-export");
+				if (existsSync(exportedFile)) {
+					await cp(exportedFile, targetFile);
+					console.log(`✅ Generated OG image for: ${slideName}`);
+					await rm(exportDir, {
+						recursive: true,
+						force: true
+					});
+				} else console.warn(`⚠️ Export file not found for ${slideName}: ${exportedFile}`);
+			}
+		}
+		console.log("✅ All OG images exported successfully!");
+	} catch (error) {
+		console.error("❌ Failed to export OG images:", error);
+		process.exit(1);
+	}
+}
 async function copyToGhPages() {
 	const workspaceCwd = process.env.SLIDEV_WORKSPACE_CWD || process.cwd();
 	const config = loadConfig(workspaceCwd);
@@ -424,13 +464,15 @@ Usage:
   slidev-workspace <command> [options]
 
 Commands:
-  dev     Start the development server
-  build   Build the project for production
-  help    Show this help message
+  dev        Start the development server
+  build      Build the project for production
+  export-og  Export OG images for all slides
+  help       Show this help message
 
 Examples:
   slidev-workspace dev                                    # Start development server
   slidev-workspace build                                  # Build all slides and preview app
+  slidev-workspace export-og                              # Export OG images for all slides
 
 Configuration:
   Use slidev-workspace.yml to set baseUrl for all builds
@@ -449,6 +491,10 @@ async function main() {
 			process.env.SLIDEV_WORKSPACE_CWD = process.cwd();
 			await runViteBuild();
 			break;
+		case "export-og":
+			process.env.SLIDEV_WORKSPACE_CWD = process.cwd();
+			await exportOgImages();
+			break;
 		case "help":
 		case "--help":
 		case "-h":

package/dist/index.js

@@ -64,7 +64,7 @@ function resolveImageUrl(slide, domain) {
 	if (hasOgImage) {
 		const imagePath = `og-image.png?v=${Date.now()}`;
 		try {
-			const path = IS_DEVELOPMENT ? pathJoin(slidePath, imagePath) : pathJoin(baseUrl, slidePath, imagePath);
+			const path = IS_DEVELOPMENT ? imagePath : pathJoin(baseUrl, slidePath, imagePath);
 			return new URL(path, domain).href;
 		} catch (error) {
 			console.error("Failed to resolve og-image.png path:", error);
@@ -83,7 +83,7 @@ function resolveImageUrl(slide, domain) {
 	if (background) {
 		if (isUrl(background)) return background;
 		try {
-			return IS_DEVELOPMENT ? new URL(pathJoin(slidePath, background), domain).href : new URL(pathJoin(baseUrl, slidePath, background), domain).href;
+			return IS_DEVELOPMENT ? new URL(background, domain).href : new URL(pathJoin(baseUrl, slidePath, background), domain).href;
 		} catch (error) {
 			console.error("Failed to resolve background path:", error);
 			return "https://cover.sli.dev";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "slidev-workspace",
-  "version": "0.5.2",
+  "version": "0.6.1",
   "description": "A workspace tool for managing multiple Slidev presentations with API-based content management",
   "type": "module",
   "license": "MIT",

package/src/preview/composables/useSlides.test.ts

@@ -45,7 +45,7 @@ describe("resolveImageUrl (Development Mode)", () => {
 
     const result = resolveImageUrl(slide, domain);
 
-    expect(result).toBe("http://localhost:3001/og-image.png");
+    expect(result).toMatch(/^http:\/\/localhost:3001\/og-image\.png\?v=\d+$/);
   });
 
   it("should return seoMeta.ogImage when it's an absolute URL", async () => {
@@ -115,9 +115,7 @@ describe("resolveImageUrl (Development Mode)", () => {
 
     const result = resolveImageUrl(slide, domain);
 
-    expect(result).toBe(
-      "http://localhost:3001/slides-presentation-1/background.jpg",
-    );
+    expect(result).toBe("http://localhost:3001/background.jpg");
   });
 
   it("should return default cover when no image sources provided", async () => {
@@ -150,7 +148,7 @@ describe("resolveImageUrl (Development Mode)", () => {
 
     const result = resolveImageUrl(slide, domain);
 
-    expect(result).toBe("http://localhost:3001/og-image.png");
+    expect(result).toMatch(/^http:\/\/localhost:3001\/og-image\.png\?v=\d+$/);
     expect(result).not.toBe("https://example.com/image.jpg");
   });
 
@@ -217,13 +215,14 @@ describe("resolveImageUrl (Production Mode)", () => {
     const slide = createMockSlide({
       hasOgImage: true,
       baseUrl: "/slidev-workspace-starter",
+      path: "/slides-presentation-1/",
     });
     const domain = "https://my-slides.com";
 
     const result = resolveImageUrl(slide, domain);
 
-    expect(result).toBe(
-      "https://my-slides.com/slidev-workspace-starter/og-image.png",
+    expect(result).toMatch(
+      /^https:\/\/my-slides\.com\/slidev-workspace-starter\/slides-presentation-1\/og-image\.png\?v=\d+$/,
     );
   });
 
@@ -443,7 +442,9 @@ describe("useSlides (Development Mode)", () => {
 
       const firstSlide = slides.value[0];
 
-      expect(firstSlide.image).toBe("http://localhost:3001/og-image.png");
+      expect(firstSlide.image).toMatch(
+        /^http:\/\/localhost:3001\/og-image\.png\?v=\d+$/,
+      );
     });
 
     it("should use default cover when no background is provided", async () => {
@@ -540,8 +541,8 @@ describe("useSlides (Production Mode)", () => {
       const result = await setupUseSlidesProduction();
       const firstSlide = result.slides.value[0];
 
-      expect(firstSlide.image).toBe(
-        "https://my-slides.com/slidev-workspace-starter/og-image.png",
+      expect(firstSlide.image).toMatch(
+        /^https:\/\/my-slides\.com\/slidev-workspace-starter\/slides-presentation-1\/og-image\.png\?v=\d+$/,
       );
     });
 
@@ -567,8 +568,8 @@ describe("useSlides (Production Mode)", () => {
 
       // First slide has hasOgImage: true, so should use og-image.png
       expect(firstSlide.image).toContain("og-image.png");
-      expect(firstSlide.image).toBe(
-        "https://my-slides.com/slidev-workspace-starter/og-image.png",
+      expect(firstSlide.image).toMatch(
+        /^https:\/\/my-slides\.com\/slidev-workspace-starter\/slides-presentation-1\/og-image\.png\?v=\d+$/,
       );
     });
 

package/src/preview/composables/useSlides.ts

@@ -40,7 +40,7 @@ export function resolveImageUrl(slide: SlideInfo, domain: string): string {
     const imagePath = `og-image.png?v=${Date.now()}`;
     try {
       const path = IS_DEVELOPMENT
-        ? pathJoin(slidePath, imagePath)
+        ? imagePath
         : pathJoin(baseUrl, slidePath, imagePath);
 
       return new URL(path, domain).href;
@@ -74,7 +74,7 @@ export function resolveImageUrl(slide: SlideInfo, domain: string): string {
 
     try {
       return IS_DEVELOPMENT
-        ? new URL(pathJoin(slidePath, background), domain).href
+        ? new URL(background, domain).href
         : new URL(pathJoin(baseUrl, slidePath, background), domain).href;
     } catch (error) {
       console.error("Failed to resolve background path:", error);