home

หน้าแรก
 Computer >> บทช่วยสอนคอมพิวเตอร์ >  >> การเขียนโปรแกรม >> JavaScript

บังคับให้ Chrome Script Debugger โหลด JavaScript ใหม่ (Force Reload)

เมื่อแก้ไขไฟล์ JS แล้ว Chrome DevTools ยังแสดงโค้ดเก่า (Cache) ให้บังคับ Reload ด้วยวิธีด้านล่าง

ขั้นตอนใน DevTools

  1. เปิด DevTools (F12)
  2. ไปแท็บ Sources
  3. หา Script/File ใน File Navigator (ซ้าย)
  4. ดู Right Panel (Source View) ว่าเป็นโค้ดใหม่ไหม

ถ้ายังเป็นโค้ดเก่า (Cache)

  • Right-click ไฟล์ใน Navigator → Open Link in New Tab
  • ใน Tab ใหม่ กด Ctrl + F5 (Force Reload / Hard Refresh)
  • หรือกดค้างปุ่ม Refresh → เลือก Empty Cache and Hard Reload

วิธีอื่นๆ

Workspaces (แก้ไขไฟล์จริงใน DevTools)

  1. Sources → Filesystem Tab → Add Folder to Workspace
  2. Allow Permission
  3. Map ไฟล์ Network กับ Local (Right-click → Map to File System Resource)
  4. แก้ไขใน Sources → Save (Ctrl+S) → ไฟล์จริงเปลี่ยน → Reload ไม่ต้อง Hard Refresh

    5. หมายเหตุ: รูปภาพต้นฉบับแสดง DevTools Sources Tab UI

วิธีคำสั่ง/ขั้นตอน
Hard Reload (Keyboard)Ctrl + Shift + R (Win/Linux) / Cmd + Shift + R (Mac)
Disable Cache (DevTools เปิดอยู่)Network Tab → ☑ Disable Cache
Incognito ModeCtrl + Shift + N (ไม่มี Cache/Extension)
Clear Site DataApplication Tab → Clear Storage → Clear Site Data
Query String (Dev)<script src="app.js?v=123"> Cache Busting