r3f-fundamentals
✓React 三光纤核心设置、画布配置、场景层次结构、相机系统、照明、渲染循环和 React 集成模式。在设置新的 R3F 项目、配置 Canvas 组件、管理场景结构或理解声明式 Three.js-in-React 范例时使用。所有其他 R3F 技能所依赖的基础技能。
SKILL.md
Declarative Three.js via React components. R3F maps Three.js objects to JSX elements with automatic disposal, reactive updates, and React lifecycle integration.
| new THREE.Mesh() | | | mesh.position.set(1, 2, 3) | | | scene.add(mesh) | JSX nesting handles hierarchy | | mesh.geometry.dispose() | Automatic on unmount |
| always | Continuous animation (games, simulations) | | demand | Static scenes, only re-render on state change | | never | Manual control via invalidate() |
React 三光纤核心设置、画布配置、场景层次结构、相机系统、照明、渲染循环和 React 集成模式。在设置新的 R3F 项目、配置 Canvas 组件、管理场景结构或理解声明式 Three.js-in-React 范例时使用。所有其他 R3F 技能所依赖的基础技能。 来源:bbeierle12/skill-mcp-claude。
可引用信息
为搜索与 AI 引用准备的稳定字段与命令。
- 安装命令
npx skills add https://github.com/bbeierle12/skill-mcp-claude --skill r3f-fundamentals- 分类
- </>开发工具
- 认证
- ✓
- 收录时间
- 2026-02-01
- 更新时间
- 2026-02-18
快速解答
什么是 r3f-fundamentals?
React 三光纤核心设置、画布配置、场景层次结构、相机系统、照明、渲染循环和 React 集成模式。在设置新的 R3F 项目、配置 Canvas 组件、管理场景结构或理解声明式 Three.js-in-React 范例时使用。所有其他 R3F 技能所依赖的基础技能。 来源:bbeierle12/skill-mcp-claude。
如何安装 r3f-fundamentals?
打开你的终端或命令行工具(如 Terminal、iTerm、Windows Terminal 等) 复制并运行以下命令:npx skills add https://github.com/bbeierle12/skill-mcp-claude --skill r3f-fundamentals 安装完成后,技能将自动配置到你的 AI 编程环境中,可以在 Claude Code 或 Cursor 中使用
这个 Skill 的源码在哪?
https://github.com/bbeierle12/skill-mcp-claude
详情
- 分类
- </>开发工具
- 来源
- skills.sh
- 收录时间
- 2026-02-01