three.js dev template - module
HTML
<script type="importmap">
{
"imports": {
"three": "https://unpkg.com/three/build/three.webgpu.js",
"three/webgpu": "https://unpkg.com/three/build/three.webgpu.js",
"three/tsl": "https://unpkg.com/three/build/three.tsl.js",
"three/addons/": "https://unpkg.com/three/examples/jsm/"
}
}
</script>
CSS
body {
margin: 0px;
}
JavaScript
import * as THREE from 'three';
class MyLight extends THREE.IESSpotLight {}
const renderer = new THREE.WebGPURenderer();
await renderer.init();
const scene = new THREE.Scene();
scene.add( new MyLight() );
scene.add( new THREE.Mesh( new THREE.BoxGeometry(), new THREE.MeshStandardNodeMaterial() ) );
// warning: Light node not found for MyLight
await renderer.compileAsync( scene, new THREE.PerspectiveCamera() );