Let's make some 3D in Svelte (Part 1)

App.svelte

<script lang="ts">
  import { Canvas } from "@threlte/core";
  import Scene from "./Scene.svelte";
</script>

<div>
  <Canvas size={{ width: 1280, height: 720 }}>      
    <Scene />
  </Canvas>
</div>

<style>
  div {
    height: 100%;
    width: 100%;
  }
</style>

Scene.svelte

<script lang="ts">
  import {
    MeshStandardMaterial,
    DoubleSide,
    BoxBufferGeometry,
  } from "three";
  import {
    DirectionalLight,
    Mesh,
    OrbitControls,
    PerspectiveCamera,
  } from "@threlte/core";
</script>

<PerspectiveCamera position={{ x: 30, y: 10, z: 5 }} fov={24}>
  <OrbitControls
    target={{ y: 3 }}
  />
</PerspectiveCamera>
<Mesh
    geometry={new BoxBufferGeometry(4, 4, 4)}
    material={new MeshStandardMaterial({ side: DoubleSide, color: "white" })}
/>
<DirectionalLight position={{ x: 10, y: 10, z: 10 }} />