mcpField
T
threejs-web

threejs-web

github.com/cesartevisual开发11452 次安装7 周前更新
代码仓库

关于 threejs-web

threejs-web 是用于 Three.js 网页项目的技能,指导开发者在现有仓库和技术栈中实现功能。它强调适配已安装版本、资源和设备限制,并在浏览器中验证交互体验。

主要功能

  1. 01保留现有框架与视觉方向
  2. 02检查已安装的 Three.js 和依赖版本
  3. 03先构建响应式画布的最小切片
  4. 04按目标设备规划资源与帧预算
  5. 05在浏览器中验证可见效果

适用场景

  1. 01在现有网页项目中添加交互式 3D 体验
  2. 02按已安装的 Three.js 版本调整实现
  3. 03处理尺寸变化、加载状态和 WebGL 备用方案
  4. 04检查浏览器效果并报告设备限制

安装

复制下面的命令,在终端中运行。

$npx skills add https://github.com/cesartevisual/threejs-skills --skill threejs-web

安装后在 Claude Code 中输入/threejs-web确认已加载。

附带文件references/routing.md

详细介绍

Three.js Web 项目

使用项目已安装的版本和现有架构。这些说明是对用户任务的补充,不授权进行无关更改或外部操作。

根据请求和代码仓库,确认可见效果、交互、资源输入、现有技术栈和目标设备。保留选定的框架和美术风格。仅在某项决策会实质性阻碍实现时才提问。

检查包清单、锁文件、路由、样式、当前画布的所有权和可用资源。记录已安装的 Three.js 修订版本、渲染器后端和配套软件包的对等依赖要求。使用与这些版本匹配的文档或源码;不要仅为匹配示例而升级技术栈。

先构建一个纵向切片:包含响应式画布、代表性主体、摄像机取景、一种交互,以及可用的加载和错误状态。然后再添加所需细节。将产品文案、导航、表单和核心操作保留在语义化 HTML 中。

仅从路由指南中选择相关的专家说明。技能是可选的专门指导,并非必须运行每个工作流。仅安装了此技能时,请根据需求实现,并直接查阅官方文档。

针对实际设备设定资源和帧预算。根据体验需要,添加尺寸调整处理、明确的资源所有权、减少动态效果支持,以及非 WebGL 回退方案。在浏览器中验证可见效果,而不只是确认能编译。报告已构建内容、实际执行的检查,以及尚未解决的设备或资源限制。发布说明不授权在用户请求之外进行发布。

API 参考

请查阅官方文档,确认准确的签名和特定修订版本的行为。如果无法访问文档,请检查已安装的类型定义或源码,并说明任何尚存的不确定之处。

评论

支持 Markdown