Files
hyperframes/packages/cli/README.md
T
Vance IngallsandClaude Opus 4.6 9cbfec1eca feat(skills): add hyperframes-cli skill (#154)
* feat(skills): add hyperframes-cli skill for CLI workflow guidance

Adds a new skill that teaches AI agents how to use the HyperFrames CLI
(init, lint, dev, render, doctor). Previously, agents had no way to
discover the CLI — the compose-video skill only covered HTML authoring.
This led to agents searching for binaries, finding the monorepo, and
running bun run studio manually instead of using npx hyperframes dev.

Also registers the skill in init.ts so new projects get it bundled
alongside hyperframes-compose and hyperframes-captions.

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

* refactor(cli): rename dev command to preview

The command starts a preview server — "preview" describes what users
are doing more accurately than "dev". Updates the command name, file
name, all CLI references, docs, skills, and template CLAUDE.md.

22 files updated across CLI source, docs, skills, and templates.

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

* fix(skills): replace stale dev reference with preview in CLI skill

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

* fix(docs): catch remaining dev references missed in rename

- testing-local-changes.mdx: two inline command examples
- troubleshooting.mdx: anchor link #dev → #preview, "dev server" → "preview server"
- cli.mdx: "dev server" → "preview server"

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

---------

Co-authored-by: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-03-31 00:30:55 -07:00

128 lines
2.3 KiB
Markdown

# hyperframes
CLI for creating, previewing, and rendering HTML video compositions.
## Install
```bash
npm install -g hyperframes
```
Or use directly with npx:
```bash
npx hyperframes <command>
```
**Requirements:** Node.js >= 22, FFmpeg
## Commands
### `init`
Scaffold a new Hyperframes project from a template:
```bash
npx hyperframes init my-video
cd my-video
```
### `preview`
Start the live preview studio in your browser:
```bash
npx hyperframes preview
# Studio running at http://localhost:3002
npx hyperframes preview --port 4567
```
### `render`
Render a composition to MP4:
```bash
npx hyperframes render ./my-composition.html -o output.mp4
```
### `lint`
Validate your Hyperframes HTML:
```bash
npx hyperframes lint ./my-composition
npx hyperframes lint ./my-composition --json # JSON output for CI/tooling
npx hyperframes lint ./my-composition --verbose # Include info-level findings
```
By default only errors and warnings are shown. Use `--verbose` to also display informational findings (e.g., external script dependency notices). Use `--json` for machine-readable output with `errorCount`, `warningCount`, `infoCount`, and a `findings` array.
### `compositions`
List compositions found in the current project:
```bash
npx hyperframes compositions
```
### `benchmark`
Run rendering benchmarks:
```bash
npx hyperframes benchmark ./my-composition.html
```
### `doctor`
Check your environment for required dependencies (Chrome, FFmpeg, Node.js):
```bash
npx hyperframes doctor
```
### `browser`
Manage the bundled Chrome/Chromium installation:
```bash
npx hyperframes browser
```
### `info`
Print version and environment info:
```bash
npx hyperframes info
```
### `docs`
Open the documentation in your browser:
```bash
npx hyperframes docs
```
### `upgrade`
Check for updates and show upgrade instructions:
```bash
npx hyperframes upgrade
npx hyperframes upgrade --check --json # machine-readable for agents
```
## Documentation
Full documentation: [hyperframes.heygen.com/packages/cli](https://hyperframes.heygen.com/packages/cli)
## Related packages
- [`@hyperframes/core`](../core) — types, parsers, frame adapters
- [`@hyperframes/engine`](../engine) — rendering engine
- [`@hyperframes/producer`](../producer) — render pipeline
- [`@hyperframes/studio`](../studio) — composition editor UI