Skip to content

feat(cli): add @videojs/cli docs command for LLM-friendly installation#1214

Draft
decepulis wants to merge 3 commits intomainfrom
feat/docs-cli
Draft

feat(cli): add @videojs/cli docs command for LLM-friendly installation#1214
decepulis wants to merge 3 commits intomainfrom
feat/docs-cli

Conversation

@decepulis
Copy link
Copy Markdown
Collaborator

@decepulis decepulis commented Apr 3, 2026 •
edited
Loading

Summary

  • Adds @videojs/cli, a CLI that serves Video.js docs from the command line with codegen for the installation page
  • Extracts codegen logic from site React components into shared pure functions
  • Adds HumanCase/LLMCase Astro components + Turndown rules for browser vs. LLM content splitting
  • CLI reads bundled markdown from site build output, replaces markers with generated code
  • Added to release-please linked-versions group so it's versioned and published with the other packages

Commands

npx @videojs/cli docs how-to/installation --framework react --media hls
npx @videojs/cli docs <slug> --framework <html|react>
npx @videojs/cli docs --list --framework html
npx @videojs/cli config set framework react

Before merging: npm setup

  1. Initialize the package on npm: npm publish --access public manually once from packages/cli/ to create the @videojs/cli package on the registry
  2. Set up trusted publishing: In npm, go to @videojs/cli → Settings → Configure trusted publishing for the GitHub Actions workflow (cd.yml), matching the existing packages
  3. After that, the release-please + CD workflow publishes it automatically alongside the other packages

Closes #1185
Closes #1215

Test plan

  • Run node packages/cli/dist/index.mjs docs how-to/installation --framework html --preset video --install-method npm — verify HTML install output
  • Run node packages/cli/dist/index.mjs docs how-to/installation --framework react --media hls --install-method pnpm — verify React + HLS output
  • Run node packages/cli/dist/index.mjs docs how-to/installation --framework react --install-method cdn — verify invalid combo errors
  • Run node packages/cli/dist/index.mjs docs --list --framework html — verify llms.txt listing
  • Run node packages/cli/dist/index.mjs docs concepts/skins --framework react — verify regular doc passthrough
  • Run interactive mode: node packages/cli/dist/index.mjs docs how-to/installation — verify prompts
  • Dev server: verify installation page pickers still generate identical code
  • pnpm -F site test — 375 tests pass
  • pnpm -F @videojs/cli test — 13 tests pass
  • pnpm turbo run build --filter=@videojs/cli... — full build chain succeeds

🤖 Generated with Claude Code

@decepulis @claude
feat(cli): add @videojs/cli docs command for LLM-friendly installation
2969c83 
Introduces `@videojs/cli`, a CLI that serves Video.js documentation from
the command line with special handling for the installation page. LLMs
and humans can generate framework-specific installation code via flags
instead of the interactive web pickers that break in plain text.

Key changes:

- Extract codegen logic from site React components into pure functions
  (`site/src/utils/installation/codegen.ts`) shared by both the site
  and CLI
- Add `HumanCase`/`LLMCase` Astro components and Turndown rules so
  `installation.mdx` serves different content to browsers vs. the LLM
  markdown pipeline
- Create `packages/cli/` with `docs`, `config` commands, interactive
  prompts via @clack/prompts, and flag parsing via @bomb.sh/args
- CLI builds bundled docs from site's LLM markdown output at build time

Closes #1185

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
@netlify
Copy link
Copy Markdown

netlify bot commented Apr 3, 2026 •
edited
Loading

✅ Deploy Preview for vjs10-site ready!

Name Link
🔨 Latest commit d0b3112
🔍 Latest deploy log https://app.netlify.com/projects/vjs10-site/deploys/69cff7524780c80008cdcfaf
😎 Deploy Preview https://deploy-preview-1214--vjs10-site.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify project configuration.

@vercel
Copy link
Copy Markdown

vercel bot commented Apr 3, 2026 •
edited
Loading

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
v10-sandbox Ready Ready Preview, Comment Apr 3, 2026 5:22pm

Request Review

@github-actions
Copy link
Copy Markdown
Contributor

github-actions bot commented Apr 3, 2026 •
edited
Loading

📦 Bundle Size Report

🎨 @videojs/html — no changes
Presets (7)
Entry Size
/video (default) 24.90 kB
/video (default + hls) 156.69 kB
/video (minimal) 24.89 kB
/video (minimal + hls) 156.60 kB
/audio (default) 23.04 kB
/audio (minimal) 23.04 kB
/background 6.92 kB
Media (7)
Entry Size
/media/background-video 1.04 kB
/media/container 1.59 kB
/media/dash-video 236.43 kB
/media/hls-video 133.39 kB
/media/mux-video 155.85 kB
/media/native-hls-video 3.48 kB
/media/simple-hls-video 14.92 kB
Players (3)
Entry Size
/video/player 6.64 kB
/audio/player 6.63 kB
/background/player 6.62 kB
Skins (17)
Entry Type Size
/video/minimal-skin.css css 3.42 kB
/video/skin.css css 3.44 kB
/video/minimal-skin js 24.87 kB
/video/minimal-skin.tailwind js 25.17 kB
/video/skin js 24.92 kB
/video/skin.tailwind js 25.29 kB
/audio/minimal-skin.css css 2.48 kB
/audio/skin.css css 2.45 kB
/audio/minimal-skin js 23.09 kB
/audio/minimal-skin.tailwind js 23.26 kB
/audio/skin js 23.05 kB
/audio/skin.tailwind js 23.36 kB
/background/skin.css css 117 B
/background/skin js 1.15 kB
/base.css css 157 B
/shared.css css 88 B
/skin-element js 1.34 kB
UI Components (22)
Entry Size
/ui/alert-dialog 2.19 kB
/ui/alert-dialog-close 1.69 kB
/ui/alert-dialog-description 1.66 kB
/ui/alert-dialog-title 1.62 kB
/ui/buffering-indicator 1.93 kB
/ui/captions-button 2.00 kB
/ui/controls 1.94 kB
/ui/error-dialog 2.37 kB
/ui/fullscreen-button 1.98 kB
/ui/mute-button 2.00 kB
/ui/pip-button 1.98 kB
/ui/play-button 1.95 kB
/ui/playback-rate-button 2.00 kB
/ui/popover 2.62 kB
/ui/poster 1.80 kB
/ui/seek-button 2.01 kB
/ui/slider 1.63 kB
/ui/thumbnail 2.22 kB
/ui/time 1.70 kB
/ui/time-slider 2.03 kB
/ui/tooltip 2.55 kB
/ui/volume-slider 2.29 kB

Sizes are marginal over the root entry point.

⚛️ @videojs/react — no changes
Presets (7)
Entry Size
/video (default) 19.87 kB
/video (default + hls) 151.72 kB
/video (minimal) 19.92 kB
/video (minimal + hls) 151.82 kB
/audio (default) 16.67 kB
/audio (minimal) 16.74 kB
/background 3.15 kB
Media (6)
Entry Size
/media/background-video 476 B
/media/dash-video 236.26 kB
/media/hls-video 133.27 kB
/media/mux-video 155.90 kB
/media/native-hls-video 3.44 kB
/media/simple-hls-video 14.93 kB
Skins (14)
Entry Type Size
/video/minimal-skin.css css 3.35 kB
/video/skin.css css 3.37 kB
/video/minimal-skin js 19.84 kB
/video/minimal-skin.tailwind js 23.30 kB
/video/skin js 19.80 kB
/video/skin.tailwind js 23.39 kB
/audio/minimal-skin.css css 2.38 kB
/audio/skin.css css 2.34 kB
/audio/minimal-skin js 16.66 kB
/audio/minimal-skin.tailwind js 19.13 kB
/audio/skin js 16.60 kB
/audio/skin.tailwind js 19.13 kB
/background/skin.css css 90 B
/background/skin js 272 B
UI Components (19)
Entry Size
/ui/alert-dialog 2.00 kB
/ui/buffering-indicator 1.63 kB
/ui/captions-button 1.83 kB
/ui/controls 1.67 kB
/ui/error-dialog 2.10 kB
/ui/fullscreen-button 1.79 kB
/ui/mute-button 1.78 kB
/ui/pip-button 1.77 kB
/ui/play-button 1.75 kB
/ui/playback-rate-button 1.79 kB
/ui/popover 3.36 kB
/ui/poster 1.53 kB
/ui/seek-button 1.78 kB
/ui/slider 2.48 kB
/ui/thumbnail 2.06 kB
/ui/time 1.89 kB
/ui/time-slider 3.35 kB
/ui/tooltip 2.52 kB
/ui/volume-slider 2.79 kB

Sizes are marginal over the root entry point.

🧩 @videojs/core — no changes
Entries (8)
Entry Size
. 5.29 kB
/dom 8.92 kB
/dom/media/custom-media-element 1.76 kB
/dom/media/dash 235.82 kB
/dom/media/hls 132.72 kB
/dom/media/mux 155.32 kB
/dom/media/native-hls 2.84 kB
/dom/media/simple-hls 14.40 kB
🏷️ @videojs/element — no changes
Entries (2)
Entry Size
. 999 B
/context 943 B
📦 @videojs/store — no changes
Entries (3)
Entry Size
. 1.39 kB
/html 696 B
/react 360 B
🔧 @videojs/utils — no changes
Entries (10)
Entry Size
/array 104 B
/dom 1.53 kB
/events 319 B
/function 261 B
/object 247 B
/predicate 265 B
/string 148 B
/style 190 B
/time 478 B
/number 158 B
📦 @videojs/spf — no changes
Entries (3)
Entry Size
. 40 B
/dom 12.45 kB
/playback-engine 12.41 kB
ℹ️ How to interpret

All sizes are standalone totals (minified + brotli).

Icon Meaning
✅ No change
🔺 Increased ≤ 10%
🔴 Increased > 10%
🔽 Decreased
🆕 New (no baseline)

Run pnpm size locally to check current sizes.

@decepulis @claude
feat(cli): add @videojs/cli to release-please config
06b9f90 
Include the CLI package in the linked-versions group so it gets
versioned and published alongside the other packages.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
@decepulis @claude
fix(build): exclude CLI from build:packages, add build:cli step
d0b3112 
The CLI depends on site build output, which would drag the entire site
build into `build:packages`. Exclude it with a negative filter and add
a dedicated `build:cli` step to the CD workflow that runs after packages
and CDN builds.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

No reviews

Assignees

No one assigned

Labels

None yet

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

Feature: Docs CLI Command Docs: Make Installation Page LLM-Friendly

1 participant

@decepulis