Tag Archive Tab

Byphunsanit

VS Code: ลดพื้นที่จาก space เป็น tab

จัดบรรทัด (Indentation) โดยใช้อยู่ 2 แบบหลักคือ 4 Space กับ tab นิยมใช้เหมือนกันแต่ tab มันจะประหยัดกว่า 3 ตัวอักษรจากระยะที่เท่า ๆ กัน การตั้งให้ VS Code ใช้ tab แทน 4 space เป็นวิธีการที่ดีในการลดพื้นที่ไฟล์ ช่วยในการประหยัดหลาย ๆ อย่าง

การเปลี่ยน 4 space เป็น tab ใน VS Code ทำได้ง่ายๆ โดยเปลี่ยนการตั้งค่าใน Settings (Ctrl+,) ค้นหา

editor.insertSpaces แล้วติ๊กออก หรือคลิกที่แถบสถานะล่างขวา (ที่เขียนว่า “Spaces: 4” หรือ “Tab Size: 4”) แล้วเลือก “Indent Using Tabs” จากนั้นใช้คำสั่ง Convert Indentation to Tabs ใน Pallete (Ctrl+Shift+P) หรือใช้ Find & Replace (Ctrl+H) แทนที่ ” ” (4 space) ด้วย “\t” (tab).


วิธีที่ 1: ตั้งค่าถาวรใน Settings (สำหรับไฟล์ทั้งหมด)

  1. เปิด Settings โดยกด Ctrl + , (หรือ Cmd + , บน Mac).
  2. ค้นหา editor.insertSpaces.
  3. ติ๊กเอาช่องออก (Uncheck) เพื่อบอกให้ VS Code ใช้ Tab แทน Space.
  4. ค้นหา editor.tabSize และตั้งค่าเป็น 4 (ถ้ายังไม่ได้ตั้ง). 

วิธีที่ 2: เปลี่ยนเฉพาะไฟล์ที่เปิดอยู่ (Quick Fix)

  1. มองที่แถบสถานะด้านล่างขวาของ VS Code (อาจจะเขียนว่า “Spaces: 4” หรือ “Tab Size: 4”).
  2. คลิกที่ตรงนั้น.
  3. เลือก “Indent Using Tabs” (ถ้ามี) หรือ “Convert Indentation to Tabs”

วิธีที่ 3: ใช้ Find & Replace (สำหรับบางส่วนของไฟล์)

  1. กด Ctrl + H (Find & Replace).
  2. ในช่อง Find: พิมพ์ (วรรค 4 ครั้ง).
  3. ในช่อง Replace: พิมพ์ \t (แล้วกดปุ่ม Tab บนคีย์บอร์ด 1 ครั้ง).
  4. (ไม่จำเป็น) กดปุ่ม .* (Toggle Regular Expression) แล้วพิมพ์ \t ในช่อง Replace.
  5. กด Replace All.

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