วิธีใช้งาน
- วางโค้ดของคุณ หรือคลิก “โหลดตัวอย่าง” เพื่อทดลองใช้
- เลือก JavaScript, TypeScript หรือ JSON แล้วตั้งค่าการเยื้อง ความกว้างบรรทัด อัฒภาค และรูปแบบเครื่องหมายคำพูด
- คลิก “จัดรูปแบบ” หรือกด Ctrl+Enter (⌘+Enter บน Mac)
- คัดลอกโค้ดที่จัดรูปแบบแล้ว
คำอธิบายตัวเลือก
- การเยื้อง
- การเยื้อง 2 ช่องว่างเป็นค่าเริ่มต้นของ Prettier และเป็นรูปแบบที่พบบ่อยที่สุดในโครงการ JavaScript การเยื้องแบบแท็บจะใช้อักขระแท็บ
- ความกว้างบรรทัด
- Prettier จะขึ้นบรรทัดใหม่ให้นิพจน์ที่ยาวเกินจำนวนอักขระนี้ ค่าเริ่มต้นคือ 80
- อัฒภาค
- ปิดตัวเลือกนี้เพื่อไม่ใส่อัฒภาคท้ายคำสั่ง Prettier ยังคงเพิ่มอัฒภาคในจุดที่การละไว้จะทำให้ความหมายเปลี่ยนไป
- เครื่องหมายคำพูดเดี่ยว
- ใช้เครื่องหมายคำพูดเดี่ยวแทนเครื่องหมายคำพูดคู่สำหรับสตริง เว้นแต่จะทำให้ต้องใส่อักขระหลีกเพิ่ม
ตัวอย่าง
บันเดิลที่ย่อขนาด. วางโค้ดตัวอย่างแบบย่อในบรรทัดเดียวเพื่อดูว่าทำอะไร — การจัดรูปแบบจะคืนการเยื้องและการขึ้นบรรทัดใหม่ แม้ชื่อตัวแปรสั้นจะยังคงสั้นเหมือนเดิม
รูปแบบสำหรับทีม. ตั้งค่าให้ตรงกับการตั้งค่า Prettier ของโครงการ เช่น เยื้อง 4 ช่องว่าง ไม่ใช้อัฒภาค และใช้เครื่องหมายคำพูดเดี่ยว
คำถามที่พบบ่อย
ใช้กับ JSX และไวยากรณ์สมัยใหม่ได้หรือไม่
ได้ โหมด JavaScript ใช้ตัวแยกวิเคราะห์ของ Babel ซึ่งเข้าใจ JSX, optional chaining, class fields, top-level await และไวยากรณ์สมัยใหม่อื่น ๆ
เหตุใดจึงแจ้งว่ามีข้อผิดพลาดทางไวยากรณ์
Prettier ต้องแยกวิเคราะห์โค้ดก่อนจัดรูปแบบ จึงหยุดเมื่อพบโค้ดที่ไม่ใช่ JavaScript ที่ถูกต้อง ข้อความจะแสดงบรรทัดและคอลัมน์ที่ควรตรวจสอบ
โค้ดที่จัดรูปแบบแล้วจะทำงานเหมือนเดิมหรือไม่
ใช่ Prettier เปลี่ยนเฉพาะช่องว่าง การขึ้นบรรทัดใหม่ เครื่องหมายคำพูด วงเล็บ และอัฒภาคในลักษณะที่คงความหมายของโค้ดไว้
โค้ดของฉันถูกอัปโหลดหรือไม่
ไม่ Prettier ทำงานในเบราว์เซอร์ของคุณ โค้ดจึงยังคงอยู่บนอุปกรณ์ของคุณ
ความเป็นส่วนตัว
เครื่องมือนี้ทำงานในเบราว์เซอร์ของคุณทั้งหมด ไฟล์และข้อความของคุณได้รับการประมวลผลบนอุปกรณ์ของคุณ และจะไม่ถูกอัปโหลดไปยังเซิร์ฟเวอร์ของเรา