Emmet - ตัวแทน Zen Coding
เคยเขียนเรื่อง Zen Coding ใน Netbeans มาแล้วครั้งหนึ่ง ตอนนี้ Zen Coding เปลี่ยนชื่อเป็น Emmet แล้วครับ มาพร้อมกับฟีเจอร์ใหม่อีกเยอะแยะมากมาย เห็นที่ฮอตๆ ก็คงเป็นส่วนของ CSS เช่น m10 เป็น margin: 10px; รวมถึงจัดการ vendor prefix ให้ด้วย (ดูตัวอย่าง) นอกจากนี้ยังมี action อีกมากมายที่ทำให้โค้ดได้เร็วขึ้น ผมเขียนเองไม่หมด ตามไปดูได้ที่ https://docs.emmet.io/ ครับผม เขาทำ document ไว้ดีมากเลยล่ะ
ติดตั้ง Emmet ใน Sublime Text 2
Emmet กับ Sublime Text นั้นถือว่าเข้ากันได้อย่างเป็นปี่เป็นขลุ่ยกันเลยทีเดียว (ว่าไปนั่น) มีปลั๊กอิน Emmet for Sublime Text บน Github ด้วย โดยที่ก่อนติดตั้ง Emmet นั้นต้องเอา Zen Coding ออกก่อน (Package Control > Remove Package > Zen Coding) ไม่งั้นมันจะตีกันแล้วจะเดี้ยงทั้งคู่
เราสามารถติดตั้ง Emmet ได้จาก Package Control ครับ แต่ ณ ตอนที่เขียนอยู่นี้ เห็นหลายคนมีปัญหากับ Package Control ที่ดาวน์โหลด zip ball จาก Github ไม่ได้ ทำให้ลงปลั๊กอินไม่ผ่าน ดังนั้นแนะนำให้ลงแบบ manual ดีกว่า คือโหลดไฟล์ทั้งหมดของ Emmet มาไว้ที่โฟลเดอร์ Packages ของ Sublime Text
$ cd ~/.config/sublime-text-2/Packages/
$ git clone https://github.com/sergeche/emmet-sublime.git
จากนั้น restart Sublime Text ก็น่าจะใช้งานได้ละครับ
ลง Zen Coding/Emmet แล้วกด Enter ไม่ลง
YuthNo ถามมาเมื่อวาน ผมก็เคยเจอบ้างเหมือนกัน ลองลบทั้ง Zen Coding กับ Emmet ออกทั้งคู่แล้วลงใหม่ดูครับ ถ้ายังไม่เวิร์กอีก อาจเป็นเพราะเวอร์ชั่นของแพ็คเกจบางแพ็คเกจนั้นเก่าเกินไป (ผมเจอใน Ubuntu) ลองตามไปอ่านได้ที่ issue#87 หรือ issue อื่นๆ ก็ได้ครับ
Happy Coding ครับผม :)
Related posts
