Claude Code 装上它,3D 开发直接开挂!
最近在玩 Three.js,发现 Claude Code 虽然强,但直接让它写 3D 代码经常跑不通——API 对不上、导入路径写错、动画混合器不会配。。
直到我挖到了这个 threejs-skills,10 个专项技能文件,覆盖从场景搭建到着色器定制的全流程,87.5K 安装量,⭐ 3.1K,开发者圈子里已经火了。
它解决了什么问题?
Claude Code 本身懂编程但不懂 Three.js specifics——它不知道 three/addons/ 的导入格式、不知道 AnimationMixer 怎么初始化、不知道 PBR 材质怎么配。
threejs-skills 就是来补这个坑的。每个 skill 文件都是一份精校的 Three.js API 参考 + 可直接复制的代码示例,Claude Code 遇到对应任务会自动加载。
10 个技能,精准覆盖 3D 开发全链路
| 技能 | 用途 | 安装量 |
|---|---|---|
| threejs-animation | 关键帧动画、骨骼动画、动画混合 | 13.2K |
| threejs-fundamentals | 场景搭建、相机、渲染器、坐标系 | 10.3K |
| threejs-shaders | GLSL 着色器、自定义材质、光效 | 9.2K |
| threejs-geometry | 内置几何体、BufferGeometry、实例化渲染 | 8.6K |
| threejs-interaction | 射线检测、相机控制、鼠标/触摸交互 | 8.4K |
| threejs-materials | PBR 材质、基础材质、着色器材质 | 8.4K |
| threejs-postprocessing | 后期特效:Bloom、DOF、全屏效果 | 7.5K |
| threejs-lighting | 光源类型、阴影、环境光照 | 7.4K |
| threejs-loaders | GLTF/GLB 加载、纹理加载、异步模式 | 7.3K |
| threejs-textures | 纹理类型、UV 映射、环境贴图 | 7.2K |
随便举两个场景感受一下:
“创建一个带旋转立方体的 Three.js 场景”
→ threejs-fundamentals 自动触发,输出含渲染器初始化、动画循环、尺寸自适应处理的完整代码
“加载一个 Draco 压缩的 GLTF 模型并播放动画”
→ threejs-loaders + threejs-animation 联合触发,给出正确的 Loader 配置、AnimationMixer 初始化和错误处理
安装超简单
# 方式1:直接克隆到项目
git clone https://github.com/CloudAI-X/threejs-skills.git
# 把 .claude/skills 目录复制到你的项目里
# 方式2:作为子模块(推荐,方便更新)
git submodule add https://github.com/CloudAI-X/threejs-skills .skills
装完之后直接跟 Claude Code 说人话,它就懂。
适合谁用?
- 前端开发者:想在项目里快速集成 3D 功能
- 独立开发者 / Indie Hacker:做 3D 可视化产品原型
- AI 工具玩家:想让 Claude Code 真正帮你写能跑的 3D 代码
threejs-skills 目前持续维护中(最近更新 2026-07-09),所有代码示例都对照 Three.js r160+ 官方文档校验过,API 准确性有保障。
想给 Claude Code 装上专业的 3D 开发能力?冲这个 👇
GitHub:https://github.com/CloudAI-X/threejs-skills
评论区
登录后可评论。