เขียน Code ไวด้วย Vim ใน VS Code

VIM ย่อมาจาก Vi IMproved เป็นโปรแกรม Text Editor ที่ทำให้ผู้ใช้สามารถใช้งาน Keyboard ล้วนๆ ในการเขียน Code ได้ โดย Text Editor สมัยใหม่ก็มักจะมี VIM Mode Plugin มาให้ใช้งานได้ด้วย

การใช้ VIM มีข้อดีคือถ้าผู้ใช้มีความชำนาญ ทั้งการพิมพ์สัมผัส, การใช้ Keyboard Shortcut ของ Editor และ การใช้คำสั่ง VIM แล้ว จะทำให้สามารถทำงานใน Editor ได้ไวมาก เพราะไม่ต้องยกมือไปแตะเมาส์เลยก็ได้

เบื้องต้น Editor หลักของเราจะเป็น VS Code

ผู้เขียนใช้ Mac หลังจากติดตั้ง VS Code แล้วอยากให้เปิด Project ด้วย VS Code จาก Terminal ได้ ต้องไปตั้งค่าก่อน โดย

• เข้าไปที่ VS Code
• เปิด Command Palette (⇧⌘P)
• เลือก Install ‘code’ command in PATH

จากนั้นจะสามารถเปิด Project ด้วย VS Code จาก Terminal ได้ ด้วยคำสั่ง code .

จากนั้นสามารถเข้าไปติดตั้ง Vim Extension ได้ที่เมนูดังภาพ

เมื่อติดตั้งเสร็จ เราจะเริ่มใช้ Vim ได้ละ ทีนี้ จะมาสอนวิธีการใช้งานเบื้องต้นและคำสั่งที่ใช้บ่อยๆ

หลังจากติดตั้ง เวลาเราเข้าไฟล์ต่างๆ เราจะเห็น Cursor ของเราเป็นดังภาพ แสดงว่าติดตั้งสำเร็จใช้งานได้

การทำงานของ Vim จะมี Mode การทำงานอยู่ คือ เมื่อเราเปิด File ขึ้นมาปกติ จะเป็น Normal Mode เป็น Mode ที่เอาไว้ดูข้อมูล หรือย้าย Cursor ไปยังจุดต่างๆ เพื่อทำงาน เปรียบเสมือการเลื่อนเมาส์ Scroll เมาส์ ของเราปกติ แต่เราไม่ต้องจับเมาส์

Mode ของ Vim ในขณะนั้น สามารถดูได้ที่แถบด้านล่าง

การเลื่อน Cursor ไปยังจุดต่าง พื้นฐานคือ

• ล่าง : j
• บน : k
• ขวา : l
• ซ้าย : h

เมื่อเลื่อนจนสุดจอ จอก็จะเลื่อนตามให้ (เวลาใช้งาน vim command ต้อง keyboard layout : EN )

ใน Mode Normal นี้ เราจะไม่สามารถพิมพ์ได้ การพิมพ์ เราจะต้องเข้า Mode Insert ด้วยการกด i

พอเราเลื่อน Cursor ไปยังจุดที่ต้องการจะพิมพ์แล้วกด i , Cursor ก็จะเปลี่ยนเป็นเส้นและเราสามารถพิมพ์ได้ตามปกติ เมื่อพิมพ์เสร็จ ให้เรากด esc ก็จะกลับไป mode normal ปกติ

ทีนี้ การเลื่อนไปทั่วเอกสาร ด้วย jklh อาจจะดูช้าไป เราก็จะใช้คำสั่งอื่นๆ ในการช่วยให้ไปทั่วเอกสารได้อย่างรวดเร็ว ใน Normal Mode เช่น

• gg : ไปบนสุดของเอกสาร
• shift(⇧) + g : ไปล่างสุดของเอกสาร
• : + number : ไปยังบรรทัดที่ต้องการ ตัวอย่างในภาพ

• $ : ไปยังคำท้ายสุดของบรรทัดนั้น
• ^ : ไปยังคำหน้าสุดของบรรทัดนั้น
• / + คำที่ต้องการ : ไปยังคำที่ต้องการถัดไปจากจุดที่ cursor อยู่ เช่น /const และสามารถกด n เพื่อไปยังคำเหมือนถัดไป และ N ไปยังคำที่เจอก่อนหน้าได้

คำสั่งสะดวกอื่นๆ ที่ผมใช้บ่อยๆ

• dd : ลบบรรทัดนั้น สามารถใช้ p เพื่อวางข้อความที่ลบไปได้
• v : เข้า visual mode และสามารถ select text ได้
• y : ใช้ copy text ที่ select หลังจาก v ได้
• p : ใช้วาง text ที่ select
• shift + v เลือกทั้งบรรทัดนั้น
• เมื่อ cursor อยู่ในกรอบต่างๆ เช่น “ ”, ‘ ’ , [ ] เราสามารถใช้ c + i + “ เพื่อลบทุกอย่างที่อยู่ในสัญลักษณ์นั้นได้ c + i + ‘ , c + i + [
• จากข้อบน เปลี่ยนเป็น v เพื่อ select ได้เช่นกัน
• :q : ปิด file ไม่สำเร็จถ้ามี change
• :q! : ปิด file โดยไม่ save
• :x : ปิด file พร้อม save

คำสั่งอื่นๆ อีกมากมายดูได้ ที่นี่

ปัญหาหนึ่งของ Vim ใน VS Code คือ เวลาใช้ jklh จะต้องกดย้ำๆ เพื่อไปหลายบรรทัด สามารถแก้ได้โดย เปิด key-repeating ด้วยคำสั่งใน terminal

defaults write com.microsoft.VSCode ApplePressAndHoldEnabled -bool fals

ที่นี้เวลากด j , k , h , l ค้าง จะทำให้ cursor เลื่อนไปเรื่อยๆ ตามที่ต้องการได้

ข้อดีของ Vim นอกจากจะทำให้เราทำงานได้ไวขึ้น สะดวกขึ้น ไม่ต้องเอื้อมมือไปจับเมาส์บ่อยๆ แล้ว เวลาเราทำงานใน Command Line การแก้ File ต่างๆ ด้วย Vim ก็สามารถทำได้อย่างเชี่ยวชาญมากขึ้น เช่น บน Server ที่ไม่มี UI และเราต้องใช้ Command Line ในการแก้ไข Config เป็นต้น

ข้อเสียของ Vim คือ เราต้องพิมพ์สัมผัสให้คล่อง, ต้องใช้เวลาในการเรียนรู้และฝึกฝนให้คุ้นชิน, และ บางทีเพื่อน หรือ คู่ Pair ใช้งานเครื่องร่วมกับเรา อาจงงได้ ถ้าเขาใช้ Vim ไม่เป็น