feat: restructure project for multi-deck support

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
2026-05-27 11:41:04 +08:00
parent 62344278a4
commit 59c0ef7f3b
5 changed files with 96 additions and 13 deletions
@@ -1,6 +1,6 @@
 # Slide Project

-Slidev presentation project. Remote Gitea repo with Docker-based CI/CD auto-deployment.
+Multi-deck Slidev presentation project. Remote Gitea repo with Docker-based CI/CD auto-deployment.

 ## Slidev Skill

@@ -8,11 +8,28 @@ All slide-related operations (create, edit, format, build, export) MUST first in

 ## Project Structure

- `slides.md` — main slide entry point
- `pages/` — additional slide files (imported via `src: ./pages/xxx.md`)
- `public/` — static assets (images, fonts)
- `.gitea/workflows/deploy.yaml` — CI/CD pipeline
- `dist/` — build output (gitignored)
+```
+index.html              # Landing page (lists all decks)
+decks/
+  <deck-name>/
+    slides.md             # Slide entry point
+    pages/                # Additional slide files (imported via src: ./pages/xxx.md)
+    public/               # Static assets (images, fonts)
+scripts/
+  build.sh                # Build all decks
+.gitea/workflows/         # CI/CD pipeline
+dist/                     # Build output (gitignored)
+```
+
+Each deck is an independent Slidev presentation under `decks/`. The build outputs to `dist/<deck-name>/` with the landing page at `dist/index.html`.
+
+## Adding a New Deck
+
+1. Create directory: `decks/<name>/`
+2. Add `decks/<name>/slides.md` with frontmatter
+3. Optionally add `pages/` and `public/` subdirectories
+4. Register in `index.html` decks array
+5. Add `dev:<name>` and `build:<name>` scripts to `package.json`

 ## Git Commit Convention

@@ -34,15 +51,17 @@ After completing slide edits, auto-commit with a descriptive message.
 ## Key Commands

 ```bash
-pnpm run dev       # Local dev server (http://localhost:3030)
-pnpm run build     # Build static SPA → dist/
-pnpm run export    # Export to PDF (requires playwright-chromium)
+pnpm run dev           # Dev server for demo deck (http://localhost:3030)
+pnpm run dev:<deck>    # Dev server for a specific deck
+pnpm run build         # Build all decks → dist/
+pnpm run build:<deck>  # Build a single deck
+pnpm run export        # Export to PDF (requires playwright-chromium)
 ```

 ## CI/CD Pipeline

 - **Trigger:** push to `main` branch
 - **Runner:** self-hosted Gitea Act Runner (label: `aliyun`), Docker mode with `/var/run/docker.sock` mounted
- **Steps:** checkout → install deps → `slidev build` → deploy dist/ to nginx container
+- **Steps:** checkout → install deps → `pnpm run build` → deploy dist/ to nginx container
 - **Deploy:** CI job spawns a sibling nginx container on the host via the mounted Docker socket (Docker out of Docker, not DinD)
- **Serve:** nginx container exposes port 8080
+- **Serve:** nginx container exposes port 8080, decks accessible at `/<deck-name>/`
@@ -0,0 +1,43 @@
+<!DOCTYPE html>
+<html lang="zh-CN">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Slides</title>
+  <style>
+    * { margin: 0; padding: 0; box-sizing: border-box; }
+    body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; background: #0f172a; color: #e2e8f0; min-height: 100vh; display: flex; align-items: center; justify-content: center; }
+    .container { max-width: 640px; width: 100%; padding: 2rem; }
+    h1 { font-size: 2rem; font-weight: 700; margin-bottom: 2rem; color: #f8fafc; }
+    .deck-list { display: flex; flex-direction: column; gap: 0.75rem; }
+    a.deck { display: flex; align-items: center; justify-content: space-between; padding: 1rem 1.25rem; background: #1e293b; border: 1px solid #334155; border-radius: 0.75rem; text-decoration: none; color: #e2e8f0; transition: all 0.2s; }
+    a.deck:hover { background: #334155; border-color: #475569; transform: translateY(-1px); }
+    a.deck .name { font-size: 1.125rem; font-weight: 600; }
+    a.deck .arrow { font-size: 1.25rem; color: #64748b; }
+    a.deck:hover .arrow { color: #94a3b8; }
+    .empty { color: #64748b; font-style: italic; padding: 1rem 0; }
+  </style>
+</head>
+<body>
+  <div class="container">
+    <h1>Slides</h1>
+    <div class="deck-list" id="decks">
+      <p class="empty">Loading...</p>
+    </div>
+  </div>
+  <script>
+    const decks = ['demo'];
+    const container = document.getElementById('decks');
+    if (decks.length === 0) {
+      container.innerHTML = '<p class="empty">No slide decks yet.</p>';
+    } else {
+      container.innerHTML = decks.map(name =>
+        `<a class="deck" href="/${name}/">
+          <span class="name">${name}</span>
+          <span class="arrow">&rarr;</span>
+        </a>`
+      ).join('');
+    }
+  </script>
+</body>
+</html>
@@ -4,8 +4,10 @@
  "description": "",
  "main": "index.js",
  "scripts": {
-    "dev": "slidev",
-    "build": "slidev build",
+    "dev": "slidev decks/demo/slides.md",
+    "dev:demo": "slidev decks/demo/slides.md",
+    "build": "bash scripts/build.sh",
+    "build:demo": "slidev build decks/demo/slides.md --base /demo/ --out dist/demo",
    "export": "slidev export"
  },
  "keywords": [],
@@ -0,0 +1,19 @@
+#!/usr/bin/env bash
+set -euo pipefail
+
+ROOT="$(cd "$(dirname "$0")/.." && pwd)"
+DIST="$ROOT/dist"
+
+rm -rf "$DIST"
+mkdir -p "$DIST"
+cp "$ROOT/index.html" "$DIST/index.html"
+
+for dir in "$ROOT"/decks/*/; do
+  [ -d "$dir" ] || continue
+  name="$(basename "$dir")"
+  echo "Building deck: $name"
+  pnpm exec slidev build "$dir/slides.md" --base "/$name/" --out "$DIST/$name"
+done
+
+echo "Done. Output: $DIST"
+ls -la "$DIST"