text: import {
    Scene,
    PerspectiveCamera,
    WebGLRenderer,
    Mesh,
    Color,
    BoxBufferGeometry,
    MeshStandardMaterial,
    DirectionalLight,
  } from 'three'
  
  const pictorial_carmine = '#CA054D'
  const dark_purple = '#3B1C32'
  const turquoise_green = '#A4D4B4'
  const light_orange = '#FFCF9C'
  const brown_sugar = '#B96D40'
  
  let container
  let camera
  let renderer
  let scene
  let mesh
  
  const s = function (element) {
    return document.querySelector(element)
  }
  
  const init = function () {
    container = s('#scene-container')
  
    // Scene
    scene = new Scene()
    scene.background = new Color(dark_purple)
  
    // Create a Camera
    const fov = 35 // AKA Field of View
    const aspect_ratio = container.clientWidth / container.clientHeight
    const near = 0.1 // the near clipping plane
    const far = 100 // the far clipping plane
    camera = new PerspectiveCamera(fov, aspect_ratio, near, far)
    camera.position.set(0, 0, 10)
  
    // Objects
    const geometry = new BoxBufferGeometry(2, 2, 2)
    const material = new MeshStandardMaterial({ color: pictorial_carmine })
    mesh = new Mesh(geometry, material)
    scene.add(mesh)
  
    // Light
    const light = new DirectionalLight(0xffffff, 1.0)
    light.position.set(10, 10, 50)
    scene.add(light)
  
    // Renderer
    renderer = new WebGLRenderer({ antialias: true })
    renderer.setSize(container.clientWidth, container.clientHeight)
    renderer.setPixelRatio(window.devicePixelRatio)
    container.appendChild(renderer.domElement)
  }
  
  function onWindowResize() {
    // set the aspect ratio to match the new browser window aspect ratio
    camera.aspect = container.clientWidth / container.clientHeight
    // update the camera's frustum
    camera.updateProjectionMatrix()
    // update the size of the renderer AND the canvas
    renderer.setSize(container.clientWidth, container.clientHeight)
  }
  
  const update = function () {
    mesh.rotation.x += 0.005
    mesh.rotation.y += 0.005
    mesh.rotation.z += 0.005
  }
  
  const render = function () {
    renderer.render(scene, camera)
  }
  
  init()
  window.addEventListener('resize', onWindowResize)
  // @ts-ignore
  renderer.setAnimationLoop(() => {
    update()
    render()
  })
  