关于 remotion-best-practices
面向使用 Remotion 编写代码的开发者,提供按主题整理的参考规则与示例,涵盖动画、媒体、合成、字幕、时序等常见任务。
主要功能
- 01按主题提供规则说明和示例
- 02动画与转场模式
- 03图片、视频、音频和字体指南
- 04合成与元数据设置
- 05字幕、图表和文本布局
适用场景
- 01查找 Remotion 动画实现模式
- 02处理 Remotion 项目中的媒体资源
- 03构建包含字幕或图表的合成
- 04检查文本尺寸与时序行为
安装
复制下面的命令,在终端中运行。
$
npx skills add https:/ / github.com/ freestylefly/ canghe-skills --skill remotion-best-practices安装后在 Claude Code 中输入/remotion-best-practices确认已加载。
包含的文件
除 SKILL.md 外,安装时一起下载的参考资料和脚本。
rules/3d.mdanimations.mdassets.mdaudio.mdcalculate-metadata.mdcan-decode.mdcharts.mdcompositions.mddisplay-captions.mdextract-frames.mdfonts.mdget-audio-duration.mdget-video-dimensions.mdget-video-duration.mdgifs.mdimages.mdimport-srt-captions.mdlottie.mdmeasuring-dom-nodes.mdmeasuring-text.mdsequencing.mdtailwind.mdtext-animations.mdtiming.mdtranscribe-captions.mdtransitions.mdtrimming.mdrules/assets/charts-bar-chart.tsxtext-animations-typewriter.tsxtext-animations-word-highlight.tsx详细介绍
何时使用
每当处理 Remotion 代码时,都可以使用此技能来获取特定领域的知识。
如何使用
阅读各规则文件以获取详细说明和代码示例:
- rules/3d.md - 使用 Three.js 和 React Three Fiber 在 Remotion 中制作 3D 内容
- rules/animations.md - Remotion 的基础动画技能
- rules/assets.md - 将图片、视频、音频和字体导入 Remotion
- rules/audio.md - 在 Remotion 中使用音频和声音 - 导入、修剪、音量、速度、音调
- rules/calculate-metadata.md - 动态设置合成时长、尺寸和 props
- rules/can-decode.md - 使用 Mediabunny 检查视频能否被浏览器解码
- rules/charts.md - Remotion 的图表和数据可视化模式
- rules/compositions.md - 定义合成、静帧、文件夹、默认 props 和动态元数据
- rules/display-captions.md - 在 Remotion 中显示字幕,支持 TikTok 风格页面和单词高亮
- rules/extract-frames.md - 使用 Mediabunny 在特定时间戳从视频中提取帧
- rules/fonts.md - 在 Remotion 中加载 Google Fonts 和本地字体
- rules/get-audio-duration.md - 使用 Mediabunny 以秒为单位获取音频文件的时长
- rules/get-video-dimensions.md - 使用 Mediabunny 获取视频文件的宽度和高度
- rules/get-video-duration.md - 使用 Mediabunny 以秒为单位获取视频文件的时长
- rules/gifs.md - 显示与 Remotion 时间轴同步的 GIF
- rules/images.md - 使用 Img 组件在 Remotion 中嵌入图片
- rules/import-srt-captions.md - 使用 @remotion/captions 将 .srt 字幕文件导入 Remotion
- rules/lottie.md - 在 Remotion 中嵌入 Lottie 动画
- rules/measuring-dom-nodes.md - 在 Remotion 中测量 DOM 元素的尺寸
- rules/measuring-text.md - 测量文本尺寸、使文本适应容器并检查溢出
- rules/sequencing.md - Remotion 的排序模式 - 延迟、修剪、限制项目的时长
- rules/tailwind.md - 在 Remotion 中使用 TailwindCSS
- rules/text-animations.md - Remotion 的排版和文本动画模式
- rules/timing.md - Remotion 中的插值曲线 - 线性、缓动、弹簧动画
- rules/transcribe-captions.md - 转录音频以在 Remotion 中生成字幕
- rules/transitions.md - Remotion 的场景过渡模式
- rules/trimming.md - Remotion 的修剪模式 - 裁剪动画的开头或结尾
- rules/videos.md - 在 Remotion 中嵌入视频 - 修剪、音量、速度、循环、音调
评论
支持 Markdown