ใน vscode จะรู้ยังไงว่า extension อะไรทำงานกับไฟล์นั้น ๆ

ใน VS Code มีวิธีตรวจสอบว่า Extension ตัวไหนกำลังทำงานหรือมีส่วนร่วมกับไฟล์ที่คุณกำลังเปิดอยู่ได้หลายวิธีครับ โดยสามารถดูได้จากช่องทางเหล่านี้

ใช้เมนู Inspector (Command Palette) — ชัวร์และละเอียดที่สุด

วิธีนี้จะบอกตรง ๆ เลยว่า Extension ตัวไหนกำลังทำงานกับไฟล์ปัจจุบันบ้าง

เปิดไฟล์ที่ต้องการตรวจสอบขึ้นมาใน Editor
กดปุ่ม Ctrl + Shift + P (Windows/Linux) หรือ Cmd + Shift + P (Mac) เพื่อเปิด Command Palette
พิมพ์คำว่า
Developer: Inspect Editor Tokens and Scopes
หรือคำสั่งเกี่ยวกับ Language Status
Developer: Inspect TM Scopes
นอกจากนี้ ยังมีวิธีที่ง่ายกว่าในหน้าต่างคำสั่ง คือพิมพ์
Help: Extension Health
หรือใช้หน้าต่าง Output โดยเลือก Dropdown มุมขวาบนเป็น Extension Host เพื่อดู Log การทำงานแบบเรียลไทม์ได้เช่นกัน

ที่แถบสถานะด้านล่างขวาของ VS Code จะบอกข้อมูลเชิงลึกที่เกี่ยวข้องกับไฟล์นั้น ๆ

Language Mode (มุมขวาล่างสุด)
เช่น ถ้าเป็นไฟล์ .js จะขึ้นว่า JavaScript หากคุณคลิกที่ชื่อภาษานั้น VS Code จะแสดงรายชื่อ Extension ทั้งหมดที่รองรับหรือผูกกับภาษานี้ขึ้นมาแนะนำ
Default Formatter
หากคลิกขวาที่ไฟล์ หรือกดปุ่มจัดหน้ากระดาษ แล้วเลือก Format Document With… VS Code จะแสดงรายชื่อ Extension (เช่น Prettier, Beautify, หรือ Extension ของภาษานั้น ๆ ) ที่พร้อมจะเข้ามาจัดการกับไฟล์นี้

ถ้าอยากรู้ว่า Extension ตัวไหนติดตั้งเพื่อรองรับไฟล์นามสกุล (Extension) นี้

ไปที่เมนู Extensions ด้านซ้าย (Ctrl + Shift + X หรือ Cmd + Shift + X)
ในช่องค้นหา ให้พิมพ์นามสกุลไฟล์นำหน้าด้วยเครื่องหมายกาลภาค (Period) เช่น @ext:.php, @ext:.vue, หรือ @ext:.py
VS Code จะกรองรายชื่อ Extension ทั้งหมดในเครื่องของคุณที่ระบุว่ารองรับไฟล์นามสกุลดังกล่าวขึ้นมาแสดงทันที

หากต้องการเช็คว่า Extension ตัวไหนกำลังรันอยู่เบื้องหลัง

เปิด Command Palette (Ctrl + Shift + P / Cmd + Shift + P)
พิมพ์คำว่า:PlaintextDeveloper: Show Running Extensions
จะมีหน้าต่างใหม่แสดงรายชื่อ Extension ทุกตัวที่กำลังทำงานอยู่ รวมถึงกินทรัพยากร (CPU/Memory) ไปเท่าไหร่ ช่วยให้รู้ว่ามีตัวไหนเกาะอยู่กับกระบวนการทำงานของ VS Code บ้างครับ

อ่านเพิ่มเติม