Importing Textures

Threeasy automatically sets up a loading manager for you. All you need to do is pass a list of textures you want to preload as an object. To use those functions you need to work inside of a function passed to postload. There’s a big trade-off here admittedly. I’m not sure that this is any less confusing than importing a texture in plain ThreeJS. However, it does avoid the awkward nesting issues of when / where to run a loader vs the animation loop.

Import crate texture

import * as THREE from "three";
import Threeasy from "threeasy";

const app = new Threeasy(THREE, {
  preload: {
    crate: "/examples/textures/crate.gif",
  },
});

app.scene.background = new THREE.Color("dodgerblue");

app.postload(() => {
  const mat = new THREE.MeshStandardMaterial({ map: app.crate });
  const geo = new THREE.BoxGeometry();

  const mesh = new THREE.Mesh(geo, mat);
  app.animate(() => {
    mesh.rotation.y += 0.01;
  });

  app.scene.add(mesh);
});