เครื่องมือสร้างการตั้งค่า Prettier

ถัดไป

เลือกค่าของตัวเลือก Prettier ที่ใช้บ่อย 10 รายการ แล้วคัดลอกการตั้งค่าที่สร้างขึ้น เครื่องมือนี้ส่งออกเป็น JSON, YAML หรือไฟล์ JavaScript แบบ CommonJS แต่จะไม่ตรวจสอบโปรเจกต์ ไม่ใช้ Prettier ตรวจความถูกต้องของการตั้งค่า และไม่เพิ่มปลั๊กอินหรือ overrides ให้

วิธีสร้างไฟล์การตั้งค่า

  1. 1

    กำหนดรูปแบบ

    เลือกความกว้างบรรทัด ความกว้างแท็บ แท็บหรือช่องว่าง เซมิโคลอน และรูปแบบเครื่องหมายคำพูด

  2. 2

    กำหนดรายละเอียดไวยากรณ์

    เลือกจุลภาคท้ายรายการ ช่องว่างในวงเล็บปีกกา วงเล็บของฟังก์ชันลูกศร รูปแบบขึ้นบรรทัดใหม่ และเครื่องหมายคำพูด JSX

  3. 3

    เลือกรูปแบบไฟล์

    สร้าง .prettierrc.json, .prettierrc.yaml หรือ .prettierrc.js แบบ CommonJS ที่ใช้ module.exports

  4. 4

    คัดลอกและตรวจสอบ

    บันทึกผลลัพธ์ไว้ในโปรเจกต์ แล้วเรียก npx prettier --check . ด้วย Prettier เวอร์ชันที่ติดตั้งอยู่

ตัวเลือกที่เครื่องมือนี้รองรับ

ตัวเลือก ค่าที่เลือกได้
printWidth 40–200
tabWidth 1–8
useTabs, semi, bracketSpacing, jsxSingleQuote true หรือ false
singleQuote true หรือ false
trailingComma none, es5 หรือ all
arrowParens always หรือ avoid
endOfLine lf, crlf, cr หรือ auto

ช่องตัวเลขจะถูกจำกัดให้อยู่ในช่วงที่แสดงไว้ ส่วนตัวเลือกอื่นจะมีเฉพาะค่าที่ระบุเท่านั้น รายการเหล่านี้เป็นการตั้งค่าทั่วไปที่มีประโยชน์ ไม่ใช่ตัวเลือกทั้งหมดที่ Prettier รองรับ

รูปแบบผลลัพธ์

  • JSON สร้างออบเจ็กต์ JSON สำหรับ .prettierrc.json
  • YAML สร้างบรรทัดคู่คีย์และค่าสำหรับ .prettierrc.yaml
  • JavaScript ครอบออบเจ็กต์เดียวกันด้วย module.exports = { ... }; สำหรับ .prettierrc.js แบบ CommonJS

Prettier ยังรองรับชื่อไฟล์การตั้งค่าและรูปแบบโมดูลอื่นด้วย แต่เครื่องมือนี้สร้างเฉพาะผลลัพธ์สามแบบข้างต้น และไม่ได้เรียกใช้ Prettier จึงควรตรวจไฟล์ที่คัดลอกด้วยเวอร์ชันที่ติดตั้งในโปรเจกต์ของคุณ

การจัดการข้อมูล

ตัวเลือกเหล่านี้เป็นฟิลด์ของเว็บไซต์ ค่าจึงถูกส่งไปยังเซิร์ฟเวอร์เมื่อหน้าเว็บอัปเดต ในมุมมองสองขั้นตอน ค่าดังกล่าวอาจปรากฏใน URL ของหน้าด้วย โดยปกติการตั้งค่า Prettier ไม่มีข้อมูลลับ แต่ไม่ควรใส่ข้อมูลสำคัญในฟิลด์เหล่านี้หรือใน URL ที่แชร์กัน

คำถามที่พบบ่อย

ไม่ เครื่องมือสร้างเฉพาะตัวเลือก 10 รายการที่แสดงในแบบฟอร์ม หากต้องการรายการอื่นที่รองรับ ให้ตรวจเอกสารของเวอร์ชันที่ติดตั้งแล้วเพิ่มด้วยตนเอง

ไม่ เครื่องมือสร้างเพียงข้อความการตั้งค่าและไม่ได้เรียกใช้ Prettier ให้บันทึกไฟล์แล้วเรียก npx prettier --check . ในโปรเจกต์ของคุณ

ไม่ได้ ผลลัพธ์เป็นออบเจ็กต์แบบแบนเพียงชุดเดียว หากโปรเจกต์ต้องใช้ ให้เพิ่ม overrides หรือตัวเลือกเฉพาะปลั๊กอินด้วยตนเอง

เพราะนี่คือรูปแบบ CommonJS ที่เครื่องมือสร้าง หากโปรเจกต์ต้องการการตั้งค่าแบบ ES module ให้ปรับคำสั่ง export และชื่อไฟล์ให้เหมาะสม

เครื่องมือที่เกี่ยวข้อง

ตารางอ้างอิง ASCII

ตาราง ASCII ครบตั้งแต่ 0 ถึง 127 พร้อมค่าเลขฐานสิบ ฐานสิบหก ฐานแปด ฐานสอง และรูปแบบการอ้างอิงอักขระแบบตัวเลขของ HTML รวม NUL, LF และ DEL

อ้างอิงตัวอักษร HTML

รายการที่สามารถค้นหาได้ขององค์ประกอบ HTML พร้อมรหัสชื่อและรหัสตัวเลข รวมถึงฟังก์ชันสำเนาด้วยคลิกเดียวสำหรับตัวอักษรพิเศษและสัญลักษณ์ต่างๆ

ตารางอ้างอิงแป้นพิมพ์ลัด

ค้นหาแป้นพิมพ์ลัดเริ่มต้นตามเอกสารของ VS Code, Chrome และ Bash ที่ใช้ GNU Readline บน macOS, Windows และ Linux

ตัวตรวจสอบอีเมล

ตรวจสอบที่อยู่อีเมล: ตรวจไวยากรณ์ RFC 5322 ค้นหา MX เรกคอร์ดแบบเรียลไทม์ พร้อมรายละเอียดส่วนท้องถิ่น โดเมน และความยาว ไม่มีการส่งอีเมลใด ๆ

เครื่องมือสร้าง EditorConfig

สร้างไฟล์ .editorconfig ด้วยกฎสไตล์และขนาดการเยื้อง การจบบรรทัด ชุดอักขระ และช่องว่างของคุณ เพื่อให้การจัดรูปแบบสอดคล้องกันในทุก IDE และโปรแกรมแก้ไข

แปลงจาก CSV เป็น JSON

แปลงไฟล์ CSV ที่มีแถวหัวข้อให้เป็น JSON ในรูปแบบอาร์เรย์ของออบเจกต์ โดยแถวหัวข้อจะทำหน้าที่เป็นคีย์ และแถวข้อมูลจะกลายเป็นออบเจกต์ เพื่อใช้งานกับ API และโค้ด JavaScript

เครื่องมือนี้มีให้บริการในภาษาอื่น