Community编程与开发github.com

vercel-labs/react-three-fiber

用于 json-render 的 React Three Fiber 3D 渲染器。适用于处理 @json-render/react-three-fiber、从 JSON 规范构建 3D 场景、渲染网格/光源/模型/环境,或将 Three.js 集成到 json-render 目录中。

react-three-fiber 是什么?

该技能提供了一个用于 json-render 的 React Three Fiber 3D 渲染器,使开发者能够通过 JSON 规范声明式地构建和渲染 3D 场景。它支持在 React Three Fiber 生态中创建网格、光源、模型和环境等元素,并允许无缝集成 Three.js 功能。此渲染器兼容主流 AI 代理开发平台,如 Claude Code、Cursor 和 Codex,通过标准化的 SKILL.md 文档确保一致的用户体验。其工作流程基于 json-render 目录结构,将复杂的 3D 配置简化为易于理解和操作的 JSON 格式,从而加速 3D 内容的开发与迭代。

兼容平台~Claude Code~Codex CLI~Cursor
Part ofReact
npx skills add https://github.com/vercel-labs/json-render/tree/main/skills/react-three-fiber

Installed? Explore more 编程与开发 skills: steipete/bluebubbles, steipete/eightctl, steipete/blucli · View all 6 →

在你喜欢的 AI 中提问

打开一个已预加载此 Agent Skill 的新对话。

文档

react-three-fiber 是做什么的?

用于 json-render 的 React Three Fiber 3D 渲染器。适用于处理 @json-render/react-three-fiber、从 JSON 规范构建 3D 场景、渲染网格/光源/模型/环境,或将 Three.js 集成到 json-render 目录中。

Individual skills in this repo

This repo contains 7 individual skills — each has its own dedicated page.

vercel-labs/core

Core package for defining schemas, catalogs, and AI prompt generation for json-render. Use when working with @json-render/core, defining schemas, creating catalogs, or building JSON specs for UI/video generation.

vercel-labs/react

React renderer for json-render that turns JSON specs into React components. Use when working with @json-render/react, building React UIs from JSON, creating component catalogs, or rendering AI-generated specs.

vercel-labs/react-native

React Native renderer for json-render that turns JSON specs into native mobile UIs. Use when working with @json-render/react-native, building React Native UIs from JSON, creating mobile component catalogs, or rendering AI-generated specs on mobile.

vercel-labs/react-pdf

React PDF renderer for json-render. Use when generating PDF documents from JSON specs, working with @json-render/react-pdf, or rendering specs to PDF buffers/streams/files.

vercel-labs/remotion

Remotion renderer for json-render that turns JSON timeline specs into videos. Use when working with @json-render/remotion, building video compositions from JSON, creating video catalogs, or rendering AI-generated video timelines.

vercel-labs/shadcn

Pre-built shadcn/ui components for json-render. Use when working with @json-render/shadcn, adding standard UI components to a catalog, or building web UIs with Radix UI + Tailwind CSS components.

vercel-labs/zustand

Zustand adapter for json-render's StateStore interface. Use when integrating json-render with Zustand for state management via @json-render/zustand.

相关技能