React Three Fiber 是现在做网页 3D 最顺手的方式，但它的入口成本在「把模型接进来」：要写加载器、处理路径、配 Suspense、调缩放。这个插件把这段样板代码生成出来。
· 一键同时导出 .glb 与 React Three Fiber 组件
· 组件自动包含 useGLTF 加载、Suspense 包裹、基础变换
· 可选 JSX 或 TSX（TypeScript）输出
· 支持自定义组件名与输出目录
· 导出的 GLB 带材质与层级，Three.js 直接可读
· 轻量：4 个文件，无额外依赖
在 Blender「编辑 → 偏好设置 → 扩展 → 从磁盘安装」选中本包 zip（不要解压）并启用。用法：「文件 → 导出」里选 R3F JSX/TSX Exporter，指定输出目录与组件名，选 JSX 或 TSX，导出后把生成的 .glb 与组件文件一起放进你的 React 项目，import 组件即可使用。
产品展示网页的 3D 模型；个人作品集网站；电商的 3D 商品预览；交互式落地页；教学演示 Blender 到网页的流程；快速做 3D 概念原型。
问：要钱吗？答：免费开源，GPL-3.0-or-later。问：需要哪个 Blender 版本？答：4.2 及以上。问：需要装 Node 吗？答：导出本身不需要，运行组件需要 React + React Three Fiber 环境。问：能导动画吗？答：GLB 里的动画数据会保留，组件里需自行用 useAnimations 播放。问：支持 Draco 压缩吗？答：当前版本导出标准 GLB，压缩可在后续工具链处理。
核心功能
· 一键同时导出 .glb 与 React Three Fiber 组件
· 组件自动包含 useGLTF 加载、Suspense 包裹、基础变换
· 可选 JSX 或 TSX（TypeScript）输出
· 支持自定义组件名与输出目录
· 导出的 GLB 带材质与层级，Three.js 直接可读
· 轻量：4 个文件，无额外依赖
安装与用法
在 Blender「编辑 → 偏好设置 → 扩展 → 从磁盘安装」选中本包 zip（不要解压）并启用。用法：「文件 → 导出」里选 R3F JSX/TSX Exporter，指定输出目录与组件名，选 JSX 或 TSX，导出后把生成的 .glb 与组件文件一起放进你的 React 项目，import 组件即可使用。
适用场景
产品展示网页的 3D 模型；个人作品集网站；电商的 3D 商品预览；交互式落地页；教学演示 Blender 到网页的流程；快速做 3D 概念原型。
常见问题
问：要钱吗？答：免费开源，GPL-3.0-or-later。问：需要哪个 Blender 版本？答：4.2 及以上。问：需要装 Node 吗？答：导出本身不需要，运行组件需要 React + React Three Fiber 环境。问：能导动画吗？答：GLB 里的动画数据会保留，组件里需自行用 useAnimations 播放。问：支持 Draco 压缩吗？答：当前版本导出标准 GLB，压缩可在后续工具链处理。
深度解读
网页 3D 的门槛这几年降得很快，R3F 把 Three.js 的命令式 API 包成了声明式组件，写起来像写 React。但「把资产接进来」这一步始终是手工的：加载器、路径、Suspense、缩放，每个模型都要复制一遍。这个插件切的正是这段样板代码——它不改变 R3F 的任何机制，只是把「导出 + 生成组件」合成一步。对做展示型网站的人来说，这意味着改一次模型就能直接刷新页面看到效果，而不是在导出与手写代码之间来回。
包内文件说明
本包为 R3F JSX/TSX Exporter 0.2.0（作者 Tom Heeley），解压后共 4 个文件、合计 71,808 字节。根目录 blender_manifest.toml（id=br3f、version 0.2.0、blender_version_min 4.2.0）、__init__.py（注册导出操作符）、BR3F.py（导出逻辑：GLB 写出与组件模板生成）、LICENSE。
原产品页：https://extensions.blender.org/add-ons/br3f/
封面图片来自作者官方产品页。本文为中文整理，功能与兼容性信息以作者官方页面与包内说明为准。资源仅供学习交流，商业使用请购买正版授权。
暂无评论内容