mirror of
https://github.com/heygen-com/hyperframes.git
synced 2026-09-03 12:52:44 +00:00
* 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>
128 lines
2.3 KiB
Markdown
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
|