AI导哈

设计与多媒体

r3f-loaders

enzed/r3f-skills

Load and reuse 3D assets in React Three Fiber with useGLTF, useLoader, Suspense, and preloading. Use for model loading, decoder setup, caching, cloning, or loading/error UI.

  • 1841 次安装
  • 131 星标
  • 收录于

安装命令

npx skills add https://github.com/enzed/r3f-skills --skill r3f-loaders

SKILL.md

React Three Fiber loaders

Inspect installed Fiber, Drei, Three.js, and React versions first. Examples use Fiber 9 / React 19. Verify actual asset paths, node names, formats, and compression; do not invent a model's structure.

Load and reuse a model

Mount below Canvas. Supply /models/robot.glb in the application. These clones have separate object transforms but intentionally share cached geometry/materials.

import { Suspense } from 'react'
import { Clone, useGLTF } from '@react-three/drei'

相关 Skills

r3f-interactionenzed/r3f-skillsImplement React Three Fiber pointer events, picking, dragging, keyboard input, and camera controls. Use for scene interaction and event propagation, rather than animation or physics simulation itself.设计与多媒体3298r3f-fundamentalsenzed/r3f-skillsSet up React Three Fiber scenes, Canvas, typed JSX, hooks, and resource ownership. Use for scene architecture and render-loop setup, rather than detailed materials or effects.设计与多媒体2172r3f-animationenzed/r3f-skillsAnimate React Three Fiber objects with useFrame, damping, and GLTF clips. Use for procedural motion, animation transitions, or demand-loop animation; use physics guidance for collision-driven movement.设计与多媒体2078r3f-postprocessingenzed/r3f-skillsConfigure React Three Fiber postprocessing, bloom, selection effects, ambient occlusion, and depth of field. Use for composer pipelines and screen-space effects, rather than mesh material shaders.前端开发1999r3f-materialsenzed/r3f-skillsChoose and configure React Three Fiber surface materials, PBR, transparency, and transmission. Use for mesh appearance and material cost; use shader guidance for custom GLSL or TSL code.前端开发1981r3f-geometryenzed/r3f-skillsBuild React Three Fiber geometry, custom buffers, instanced meshes, points, and lines. Use for shape construction and geometry draw-call optimization, rather than material appearance.前端开发1981