Mengapa setiap kali saya menyimpan projek Vite React saya, elemen kanvas baharu ditambahkan pada isi halaman dan bukannya menggantikan elemen kanvas sedia ada?
Saya cuba mula belajar ThreeJs (saya juga baru dalam pembangunan web Javascript). Selepas menonton beberapa tutorial, saya mulakan dengan Vite dan React, kemudian bermula dengan kiub berputar asas. Bahagian ini berfungsi.
Tetapi daripada apa yang saya baca tentang vite, menyimpan fail yang sedang saya usahakan sudah memadai untuk memuatkannya semula ke halaman. Tetapi sebenarnya, ia tidak. Saya menyemak kandungan halaman dan setiap kali saya menyimpan fail, 2x elemen kanvas yang sama dilampirkan pada badan halaman (bukan menggantikan yang sedia ada), yang bermaksud saya perlu menatal ke bahagian bawah halaman untuk melihat yang baharu kandungan (atau memuat semula halaman, yang mengalahkan tujuan ciri muat semula pantas Vite).
Apa salah saya? Saya membina projek asas Vite, menambahkan komponen pada apl dan mengikuti tutorial untuk melakukan pemaparan kiub asas, memintas penyegaran pantas Vite di sepanjang jalan. tolong?
Github: https://github.com/amdreallyfast/ThreeJsTutorials/tree/main/npmfrontend
Kemunculan semula:
clone cd <directory>/npmfrontend npm install npm run dev Open page in browser Inspect page -> Elements Open SceneRenderer.jsx Make change and save (ex: rotation speed; repeat multiple times) Notice how the body element on the loaded page keeps appending new canvases
