index.js

import * as THREE from 'three';
import 'three/examples/js/loaders/GLTFLoader';
import 'three/examples/js/controls/OrbitControls';

import model from './nantes2.glb';

let camera, scene, renderer, mixer, clock, prevPos;

const init = () => {
	clock = new THREE.Clock();
	camera = new THREE.PerspectiveCamera(70, window.innerWidth / window.innerHeight, 0.01, 10000);
	camera.position.y = 100;
	camera.position.z = 150;
	// camera.up = new THREE.Vector3(0, 0, 1);
	prevPos = camera.position;

	scene = new THREE.Scene();

	const light = new THREE.HemisphereLight(0xffffbb, 0x080820, 1);
	scene.add(light);

	const controls = new THREE.OrbitControls(camera);

	const loader = new THREE.GLTFLoader();
	loader.load(model, gltf => {
		console.log(gltf.animations[0]);
		scene.add(gltf.scene);
		mixer = new THREE.AnimationMixer(gltf.scene);
		mixer.clipAction(gltf.animations[0]).play();
	});

	renderer = new THREE.WebGLRenderer({ antialias: true });
	renderer.setSize(window.innerWidth, window.innerHeight);
	document.body.appendChild(renderer.domElement);
};

const animate = () => {
	requestAnimationFrame(animate);
	const delta = clock.getDelta();
	if (mixer) {
		mixer.update(delta / 10);
		const pos = mixer._bindings[0].binding.node.position;
		camera.position.copy(prevPos);
		camera.lookAt(pos);
		prevPos = pos;
	}
	renderer.render(scene, camera);
};

init();
animate();