script setup lang=tsimport refonMounted from vueimport as THREE from threeconst container = refnulllet sceneany= nulllet cameraany= nulllet rendererany = nullconst setScene = = scene = new THREESc

<script setup lang="ts">
import {ref,onMounted} from 'vue'
import * as THREE from 'three'
const container = ref(null)
let scene:any= null
let camera:any= null
let renderer:any = null

const setScene = ()=>{
    scene = new THREE.Scene()
    scene.background = new THREE.Color(0x001219)
}
const setCamera = ()=>{
    camera = new THREE.PerspectiveCamera(
        75,
        window.innerWidth/window.innerHeight,
        0.1,
        5000
    )
    camera.position.set(0,0,8)
    camera.aspect = window.innerWidth / window.innerHeight;
    camera.updateProjectionMatrix();
    scene.add(camera)
}
const setRenderer =()=>{
    renderer = new THREE.WebGLRenderer({
    antialias:true
    })
    renderer.setSize(window.innerWidth,window.innerHeight)
    container.value!.appendChild(renderer.domElement)
}
const init = ()=>{
    setScene()
    setCamera()
    setRenderer()
}
onMounted(()=>{
    init()
})
</script>
<template>
    <div ref="container"></div>
</template>