brent/kicad-manager
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix Three.js module loading for OrbitControls and STLLoader

Browse Source 
- Switch from legacy script includes to ES6 modules with import map
- Import OrbitControls and STLLoader from three/addons/
- Update constructor calls to use imported classes directly
- Remove THREE namespace prefix for OrbitControls and STLLoader
- Fixes "THREE.OrbitControls is not a constructor" error

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
brentperteet
2026-02-27 13:58:14 -06:00
parent 5966f2b4b8
commit aa7f720194
1 changed files with 18 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
templates/index.html
View File

@@ -5,9 +5,14 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>UM KiCad Manager</title> <title>UM KiCad Manager</title>
<script src="https://cdn.socket.io/4.5.4/socket.io.min.js"></script> <script src="https://cdn.socket.io/4.5.4/socket.io.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/three@0.159.0/build/three.min.js"></script> <script type="importmap">
<script src="https://cdn.jsdelivr.net/npm/three@0.159.0/examples/js/controls/OrbitControls.js"></script> {
<script src="https://cdn.jsdelivr.net/npm/three@0.159.0/examples/js/loaders/STLLoader.js"></script> "imports": {
"three": "https://cdn.jsdelivr.net/npm/three@0.159.0/build/three.module.js",
"three/addons/": "https://cdn.jsdelivr.net/npm/three@0.159.0/examples/jsm/"
}
}
</script>
<style> <style>
body { body {
font-family: Arial, sans-serif; font-family: Arial, sans-serif;
@@ -564,7 +569,14 @@
</div> </div>
{% endif %} {% endif %}
<script> <script type="module">
import * as THREE from 'three';
import { OrbitControls } from 'three/addons/controls/OrbitControls.js';
import { STLLoader } from 'three/addons/loaders/STLLoader.js';
// Make THREE available globally for debugging
window.THREE = THREE;
const libraryOnlyMode = {{ 'true' if library_only_mode else 'false' }}; const libraryOnlyMode = {{ 'true' if library_only_mode else 'false' }};
const socket = io(); const socket = io();
const statusEl = document.getElementById('status'); const statusEl = document.getElementById('status');
@@ -1341,7 +1353,7 @@
modelScene.add(directionalLight2); modelScene.add(directionalLight2);
// Controls // Controls
modelControls = new THREE.OrbitControls(modelCamera, modelRenderer.domElement); modelControls = new OrbitControls(modelCamera, modelRenderer.domElement);
modelControls.enableDamping = true; modelControls.enableDamping = true;
modelControls.dampingFactor = 0.05; modelControls.dampingFactor = 0.05;
@@ -1372,7 +1384,7 @@
} }
// Load STL // Load STL
const loader = new THREE.STLLoader(); const loader = new STLLoader();
const geometry = loader.parse(bytes.buffer); const geometry = loader.parse(bytes.buffer);
// Center and scale the geometry // Center and scale the geometry