mcpField
K
kinetograph-create

kinetograph-create

github.com/0xs4n4tg创意与媒体51615 次安装今天更新
代码仓库

关于 kinetograph-create

kinetograph-create 是用于创建 Kinetograph 项目并添加注册表内容的技能。它指导新项目初始化，也要求保留现有项目的文件布局。

主要功能

  1. 01初始化 TSX 或 HTML 项目
  2. 02安装注册表组件和模板
  3. 03添加可复用样式与资源
  4. 04保留现有项目布局

适用场景

  1. 01启动新的 Kinetograph 动画项目
  2. 02从注册表添加可复用资源
  3. 03在不移动文件的情况下准备现有项目

安装

复制下面的命令，在终端中运行。

$npx skills add https://github.com/0xs4n4tg/kinetograph --skill kinetograph-create

安装后在 Claude Code 中输入/kinetograph-create确认已加载。

详细介绍

创建 Kinetograph 项目

新建项目

在空文件夹中运行 npx kinetograph init [dir]（使用 --html 可创建 HTML 页面，而不是 TSX），保留它生成的布局，然后运行 npm install。init 会跳过已存在的文件。

src/index.tsx     registerRoot and the compositions (starter: composition "Main", 1280x720, 60 frames at 30 fps)
src/scenes/       one file per scene; reusable pieces in src/components/, helpers in src/lib/
html/index.html   with --html: a page with a GSAP timeline, instead of src/
public/           assets for staticFile(): images/, fonts/, audio/, video/
out/              everything generated: renders/, stills/, sheets/

它还会写入 package.json（包含脚本 still、strip、render 和 check，适用于 TSX；或 lint，适用于 HTML；kinetograph 是唯一的依赖项）、tsconfig.json（TSX）和 .gitignore。运行 npx kinetograph strip src/index.tsx 检查，然后继续使用 kinetograph-markup。

现有项目保留自己的布局；切勿移动其中的文件。

  • 从 @kinetographdev/core 导入 API，该包随 kinetograph 一起提供。切勿安装 remotion。
  • 使用 staticFile('images/logo.png') 加载资源。
  • 切勿在代码旁边或项目根目录下写入输出文件。如果不指定 -o，still、strip、onion 和 render 会写入 out/，并打印路径。
  • 第二个合成是在 registerRoot 下的另一个 <Composition id>；使用 --comp <id> 选择它。

组件、模板和风格

不要重写注册表中已有的内容。运行 npx kinetograph add --list 可查看内容（使用 --type component|template|taste 可缩小范围）；运行 npx kinetograph add <name…> 可安装：

  • 组件安装到 src/components/<name>/，模板（完整的短片）安装到 src/templates/<name>/，风格（可复用的样式）安装到 src/tastes/<name>/；
  • 它们的资源安装到 public/<kind>/<name>/，以及它们所依赖的注册表项目。

它绝不会覆盖你修改过的文件（使用 --overwrite 则会覆盖）。只有使用 --yes（或在终端中输入 yes）时，它才会安装项目所需的 npm 包；使用 --json 时，它只会打印命令，不会执行。--dir <folder> 用于指定项目目录。 请阅读它在 next: 下方打印的导入语句。

要根据参考短片创建风格，请使用 kinetograph-taste-clone（如果已安装，可在 kinetograph-ui 仓库中找到）。

评论

支持 Markdown