快速开始

通过你喜欢的包管理器安装 Rinne：

pnpm add @shxnovel/rinne

基础动画

使用 Rinne 最简单的方式是调用 to() 方法。

import { rinne } from '@shxnovel/rinne';

const target = { x: 0 };

rinne.to(target, { x: 100 }, { duration: 1000, ease: 'expo.out' });

// 在你的渲染循环中
function tick(dt) {
  rinne.tick(dt);
  console.log(target.x);
}

创建时间轴

对于复杂的序列编排，使用 rinne.timeline()。

const tl = rinne.timeline({ repeat: -1, yoyo: true });

tl.to(target, { x: 100 }, { duration: 1000 })
  .to(target, { y: 100 }, { duration: 1000 }, "+=500") // x 结束后 500ms 开始
  .set(target, { visible: true }, 0); // 离散状态切换

使用插件

Rinne 支持子路径导出插件，以保持你的包体积精简。

import { ColorPlugin } from '@shxnovel/rinne/plugins/color';
import { DOMPlugin } from '@shxnovel/rinne/plugins/dom';

rinne.registerPlugin(ColorPlugin);
rinne.registerPlugin(DOMPlugin);