Build Slidev Decks

Build Slidev Decks Skill

Quick validation protocol for Slidev presentation changes.

Triggers

Load this skill when you need to:

• Validate component changes — ensure modified Vue components don't break any deck builds
• Check slide edits — confirm .md file changes produce valid builds
• Bulk rebuild for deployment — rebuild all decks before commit/release

The Quick Procedure

1. Detect your OS and navigate to slides/

Windows PowerShell:

cd C:\Users\hobob\source\CopilotTraining\slides

Linux/macOS Bash:

cd /path/to/CopilotTraining/slides
chmod +x build.sh scripts/build-all.sh  # First time only

2. Run the build command

3. Read the [DONE] line

[DONE] 17 presentations built, 0 archived skipped.

✅ If you see this, builds passed. Done. ❌ If count is lower, one or more decks failed. See troubleshooting.

Single-Deck Builds (Faster Validation)

When editing a single .md file or component that affects only one deck, build just that deck to save time:

# Windows: build only copilot-cli
.\build.ps1 -Deck copilot-cli

# Also verbose for debugging:
.\build.ps1 -Deck copilot-cli -Verbose

# Linux/macOS: build only copilot-cli
./build.sh --deck copilot-cli

The script will:

1. Auto-detect the category (workshop/tech-talks/exec-talks)
2. Build only that one .md file
3. Output the same [DONE] and [CLOCK] lines

When to use:

• ✅ After editing a single .md file or its frontmatter
• ✅ After modifying a component only used by one deck
• ✅ Quick validation before pushing to a branch
• ❌ Don't use after shared component changes — use category or full rebuild instead

Expected Output

Success (all decks passed)

[SCIENCE] Building tech-talks slides...
   [HAMMER] tech-talks/agent-teams... [OK] 4.3s
   [HAMMER] tech-talks/agentic-journey... [OK] 2.3s
   ...
   [HAMMER] tech-talks/vscode-latest... [OK] 4.2s

[DONE] 17 presentations built, 0 archived skipped.
[CLOCK] Total time: 1m 0.8s

What to Ignore

• node.exe : [Slidev] Ignored provided index.html warnings in stderr
• Any warning that doesn't prevent an [OK] status on the next line

Common Issues

One deck shows [FAILED] or count is wrong

Check the failing deck:

# Windows
.\build.ps1 Tech-talks -Verbose

# Linux/macOS
./build.sh tech-talks --verbose

Look for error message in output. Usually:

• Unclosed <template> tag
• Mismatched Vue prop syntax
• Invalid HTML comments
• Broken component import

Fix and retry — the build command.

Vue SyntaxError pointing to a specific __slidev_N.md file

The N in __slidev_N.md is the slide number (1-indexed). __slidev_1 = slide 1 (Title), __slidev_5 = slide 5, etc.

Permission denied on Linux/macOS

chmod +x build.sh scripts/build-all.sh
./build.sh tech-talks

Build takes >3 minutes

First build after major dependency changes. Clear cache and retry:

npm cache clean --force
npm install
# Then run build command

Reference: Category Counts

Verify your builds using these expected counts:

Advanced: Platform Syntax Differences

If you need to script or automate builds:

One More Thing

Both wrapper scripts (build.ps1, build.sh) automatically handle path resolution. Never run from scripts/ directly — always invoke from slides/ directory. The wrappers detect their own location and navigate for you.