HyperFrames 新手实战用 hyperframes add 一键装上现成视频组件【免费下载链接】hyperframesWrite HTML. Render video. Built for agents.项目地址: https://gitcode.com/GitHub_Trending/hy/hyperframes给口播视频配字幕你不想从零搭动画只想搬来一套现成的。HyperFrames 是写 HTML、渲 MP4的开源视频框架而hyperframes add一条命令就能把目录里现成的视频组件装进你的项目装上即贴、贴上即渲。先弄清装进项目的到底是什么hyperframes add装的是两类东西Block区块和 Component组件。装完它们以普通 HTML 文件的形式躺在你项目里长这样产物长什么样你要动它吗Block 区块文件compositions/name.html独立尺寸、时长和时间线不用动默认保留原文Component 组件文件compositions/components/name.html一段特效片段不用动把里面内容粘进你的场景引入片段 snippet终端打印并自动复制到剪贴板的一行 HTML要动粘进主合成index.html补上data-start等属性项目配置记录hyperframes.json不存在时自动创建默认配置一般不用碰你实际要碰的只有一样把 CLI 给你的 snippet 粘进index.html再调时间轴属性。文件本身可以原样留着这样以后重装时 CLI 才知道哪些是你改过的、哪些是目录更新。不知道装什么先逛货架 目录里的条目比肉眼能扫完的数量多官方建议先用一句英文描述你想要的效果让hyperframes catalog帮你排好序npx hyperframes catalog --query reveal a headline one line at a time npx hyperframes catalog --type block npx hyperframes catalog --type block --tag social查询一律用英文目录以英文编写再按视频需要写任何语言的屏显文案。浏览结果后挑中哪个名字就装哪个npx hyperframes add name。也可以直接进交互选择器选中即装npx hyperframes catalog --human-friendly。跟着做一个真实小样我要做一段 30 秒的口播视频字幕得跟上。先建项目npx hyperframes init my-video然后cd my-video环境需要 Node.js 22 和 FFmpeg。接着逛货架找字幕区块比如搜出来的caption-texturenpx hyperframes add caption-texture装完终端会告诉你写了哪些文件并把一行引入片段自动复制进剪贴板。回到项目里把它粘进index.html的时间轴位置div >npx hyperframes add html-in-canvasCLI 会逐个安装并汇报最后给出类似✓ Installed 11/11 blocks的汇总装不上的条目单独标✗ skipped不影响其余条目落盘。想先看看某个标签下都有什么用浏览命令过滤npx hyperframes catalog --type block --tag html-in-canvas。常用开关一览开关什么时候用--dir 路径不想 cd 进项目例如hyperframes add contenteditable="false">【免费下载链接】hyperframesWrite HTML. Render video. Built for agents.项目地址: https://gitcode.com/GitHub_Trending/hy/hyperframes创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考