Vue Tooling ที่ควรรู้

Vue Volar

ติดตั้ง Vue - Official

// Today

1. Build Tools

เครื่องมือ	ลักษณะเด่น	คำแนะนำการใช้งาน
Vite	Build เร็วที่สุด	ใช้กับทุกโปรเจค Vue ใหม่
Nuxt	Full-stack framework	เหมาะสำหรับเว็บที่ซับซ้อน
Vitest	Testing ที่ทำงานกับ Vite ได้	ใช้ทดสอบหน่วยและ component

2. State Management

เครื่องมือ	ลักษณะเด่น	ใช้เมื่อไหร่
Pinia	Official, ใช้ง่าย	ส่วนใหญ่ใช้ได้กับทุกโปรเจค
XState	State machine	เมื่อต้องการ logic ซับซ้อน

3. Styling

เครื่องมือ	ประเภท	ข้อดี
Tailwind CSS	Utility-first	สร้าง UI ได้เร็ว
UnoCSS	Atomic CSS	เร็วและปรับแต่งได้สูง
CSS Modules	Scoped CSS	ปลอดภัยไม่ชนกัน

4. Testing

เครื่องมือ	ประเภททดสอบ	ใช้กับ
Vitest	Unit/Component	ทุกโปรเจค
Playwright	E2E	ทดสอบทั้งระบบ
Cypress Component	Component	ทดสอบ UI

5. Form Management

เครื่องมือ	หน้าที่หลัก	ใช้คู่กับ
vee-validate	Form validation	Zod
FormKit	Form builder	-

6. Deployment

Platform	ข้อเด่น	เหมาะกับ
Vercel	Deploy ง่าย, เร็ว	SPA/SSR
Cloudflare	Edge network	ต้องการความเร็วสูง
Netlify	CI/CD ในตัว	โปรเจคทั่วไป

7. Package Managers

เครื่องมือ	ความเร็ว	ข้อเด่น
pnpm	เร็ว	ประหยัดพื้นที่ดิสก์
bun	เร็วสุด	All-in-one
npm	ปานกลาง	มาตรฐาน