Sublime Text 是高效编辑器，不直接运行 Three.js，需搭配本地服务器（如 Python http.server）在浏览器中运行；关键步骤包括：CDN 引入 Three.js 及 GLTFLoader（jsm/路径）、加载 .glb 模型、requestAnimationFrame 实现动画、启用阴影及性能优化。
Sublime Text 本身不直接运行 Three.js，但它是非常高效的代码编辑器，适合编写、组织和调试 Three.js 场景代码。要实现模型加载与动画效果，关键在于：正确配置开发环境、使用合适的加载器（如 GLTFLoader）、合理组织渲染循环，并借助浏览器实时预览。下面分几步说明实际操作要点。
确保基础 HTML + JS 环境可运行
Three.js 是前端库，必须在浏览器中运行。Sublime 不带服务器功能，所以需搭配本地服务或双击 HTML 文件（注意：部分加载器如 GLTFLoader 因 CORS 限制，双击会失败）。
- 推荐用 Python 快速起一个本地服务器：
python3 -m http.server 8000（Python 3），然后访问http://localhost:8000 - HTML 中引入 Three.js（CDN 最简）：
<script src="https://cdn.jsdelivr.net/npm/three@0.160.1/examples/jsm/loaders/GLTFLoader.js"></script>
注意：GLTFLoader 在jsm/路径下，不是旧版js/，否则会报错 - 别忘了引入
OrbitControls（方便调试视角）和DRACOLoader（如需压缩模型）
用 GLTFLoader 加载 3D 模型（推荐 .glb 格式）
.glb 是二进制格式，体积小、加载快、兼容性好，比 .obj + .mtl 组合更省心。Sublime 里写加载逻辑时注意异步处理和场景添加时机。
- 创建 loader 实例后，调用
loader.load(url, onLoaded)，在onLoaded回调中把模型加到场景：scene.add(gltf.scene) - 模型可能包含多个子对象，可用
gltf.scene.traverse(...)遍历并设置材质、接收阴影等 - 若模型没纹理或黑屏，检查路径是否正确（相对 HTML 文件位置）、控制台是否有 404 或 CORS 报错
实现流畅动画：requestAnimationFrame + 更新逻辑
Three.js 动画不是靠 setInterval，而是靠 requestAnimationFrame 驱动的渲染循环。在 Sublime 编写的 JS 文件中，需封装好“更新-渲染”流程。
- 在动画函数内更新模型旋转：
model.rotation.y += 0.01，或按时间差平滑变化（推荐用clock.getDelta()） - 启用阴影需三步：设置 renderer.shadowMap.enabled = true；设置 light.castShadow = true；设置 mesh.castShadow = true 和 receiveShadow = true
- 动画中避免频繁创建对象（如 new THREE.Vector3），尽量复用变量，提升性能
Sublime 实用技巧提升 Three.js 开发效率
虽然 Sublime 不是 IDE，但合理配置后写 Three.js 很顺手。
- 安装插件 Emmet（快速生成 HTML 结构）、JSFormat（格式化 JS）、SublimeLinter-eslint（配合 ESLint 规范语法）
- 保存为
.html后，右键 → Open in Browser（需装插件 SideBarEnhancements），一键预览 - 用 Project → Save Project As… 建立 Three.js 项目，方便管理 assets（models/、textures/）和多文件协作
基本上就这些。Sublime 写 Three.js 不复杂但容易忽略服务环境和加载路径细节。模型动起来那一刻，往往就是路径对了、loader 引对了、render 循环跑起来了——剩下的就是调参数、加光照、换材质的事了。
