เซิร์ฟเวอร์พัฒนาและการแทนที่โมดูลแบบฉับไว

การแทนที่โมดูลแบบทันทีจะอัปเดตเฉพาะโมดูลที่เปลี่ยนแปลง โดยไม่โหลดทั้งหน้าใหม่ สถานะของแอปมักจะยังคงอยู่

สคริปต์ dev จะเริ่ม Vite ซึ่งให้บริการโค้ดของคุณพร้อมเปิดใช้ HMR มาให้ตั้งแต่ต้น

Vite จะแสดง URL ในเครื่อง (ค่าเริ่มต้นคือ http://localhost:5173) และ URL เครือข่ายเมื่อคุณส่ง --host

แก้ไขไฟล์ .svelte หรือไฟล์ JS ใด ๆ แล้วบันทึก เบราว์เซอร์จะอัปเดตทันที โดยมักใช้เวลาเพียงไม่กี่มิลลิวินาที

Svelte จะคงสถานะของคอมโพเนนต์ระหว่างการอัปเดต HMR เมื่อทำได้ ตัวนับที่มีค่า 5 จะยังคงเป็น 5 หลังจากปรับมาร์กอัป

การเปลี่ยนแปลงบางอย่างบังคับให้โหลดใหม่ทั้งหมด เช่น ไฟล์การตั้งค่า ฮุกของเซิร์ฟเวอร์ หรือข้อผิดพลาดในการนำเข้า Vite จะแจ้งให้คุณทราบในคอนโซล

ส่ง --host เพื่อเปิดให้เซิร์ฟเวอร์สำหรับพัฒนาเข้าถึงได้ผ่าน LAN ของคุณ ทำให้คุณทดสอบบนโทรศัพท์ได้

หากพอร์ต 5173 ถูกใช้งานอยู่ Vite จะเลือกพอร์ตถัดไปที่ว่าง คุณยังสามารถบังคับใช้พอร์ตด้วย --port 4000 ได้

เปิด DevTools ของเบราว์เซอร์เพื่อดูแผนที่ต้นฉบับที่ชี้กลับไปยังไฟล์ .svelte ต้นฉบับของคุณ ทำให้ติดตามลำดับการเรียกใช้งานได้อย่างแม่นยำ

ข้อผิดพลาดด้านไวยากรณ์หรือขณะทำงานจะแสดงเป็นแถบซ้อนทับในเบราว์เซอร์ แก้ไขโค้ด แล้วแถบนี้จะหายไปเมื่อบันทึก

กด Ctrl+C ในเทอร์มินัลเพื่อหยุดเซิร์ฟเวอร์สำหรับพัฒนา เรียกใช้ npm run dev อีกครั้งเพื่อเริ่มใหม่

HMR ทำหน้าที่อะไร

คุณสามารถเริ่มเซิร์ฟเวอร์สำหรับพัฒนา ใช้ประโยชน์จาก HMR เปิดให้เข้าถึงผ่านเครือข่าย และกู้คืนจากข้อผิดพลาดผ่านแถบแสดงข้อผิดพลาดได้แล้ว