เครื่องมือจัดรูปแบบและจัดระเบียบโค้ด
วางโค้ดหรือเปิดไฟล์ กดจัดรูปแบบ แล้วได้โค้ดที่เป็นระเบียบ ตรวจจับภาษาให้อัตโนมัติ ไม่ว่าจะเป็น JavaScript, TypeScript, CSS, HTML, JSON, XML, SQL, YAML, Markdown หรือ GraphQL ทั้งหมดในเบราว์เซอร์ของคุณ
ทุกอย่างทำงานในเบราว์เซอร์ของคุณ โค้ดไม่ถูกอัปโหลดไปยังเซิร์ฟเวอร์ใด ๆ
ความกว้างบรรทัดใช้กับ JavaScript, TypeScript, CSS, SCSS, LESS, HTML, YAML, Markdown และ GraphQL การจัดรูปแบบไม่ตรวจสอบตรรกะ ชนิดข้อมูล หรือกฎด้านสไตล์
จะตรวจจับภาษาให้ทันทีที่คุณเพิ่มโค้ด
ลากไฟล์โค้ดมาวางที่นี่ (ไม่เกิน 5 MB) วางข้อความ หรือโหลดตัวอย่าง กด Ctrl+Enter เพื่อจัดรูปแบบ
จัดรูปแบบและจัดระเบียบโค้ดในเบราว์เซอร์
โค้ดที่คัดลอกมาจากบันเดิลที่ถูกบีบอัด ล็อก ข้อความแชท หรือโปรเจกต์เก่า อ่านยากและตรวจทานยากยิ่งกว่า เครื่องมือจัดรูปแบบโค้ดนี้ทำให้โค้ดกลับมาเป็นระเบียบและเยื้องสม่ำเสมอได้ด้วยการคลิกเพียงครั้งเดียว วางโค้ด กดจัดรูปแบบ (หรือ Ctrl+Enter) แล้วผลลัพธ์จะปรากฏข้างต้นฉบับ พร้อมเลขบรรทัดทั้งสองด้านเพื่อให้เทียบกันได้ในพริบตา
เครื่องมือรองรับรูปแบบที่นักพัฒนาเจอบ่อยที่สุด ได้แก่ JavaScript พร้อม JSX, TypeScript พร้อม TSX, CSS, SCSS และ LESS, HTML พร้อมสคริปต์และสไตล์ที่ฝังอยู่ในหน้า, JSON, XML, SQL สิบสามภาษาถิ่น, YAML, Markdown และ GraphQL โดยค่าเริ่มต้นจะตรวจจับภาษาให้ จากชื่อไฟล์เมื่อคุณเปิดไฟล์ และจากตัวข้อความเมื่อคุณวาง หากข้อความเป็นได้หลายภาษา เครื่องมือจะแจ้งและเสนอตัวเลือกที่เป็นไปได้ แทนที่จะเลือกตัวแยกวิเคราะห์ผิดโดยไม่บอก
คุณควบคุมสไตล์ได้เอง เลือกเยื้อง 2 ช่องว่าง 4 ช่องว่าง หรือแท็บ และความกว้างบรรทัด 80, 100 หรือ 120 ตัวอักษรสำหรับภาษาที่จัดรูปแบบด้วย Prettier สำหรับ SQL เลือกภาษาถิ่นได้ เช่น PostgreSQL, MySQL, SQL Server หรือ BigQuery ส่วน JSON มีปุ่มบีบอัดที่ลบช่องว่างทั้งหมดโดยไม่แตะตัวเลข สตริง หรือลำดับของคีย์ การตั้งค่าจะถูกจำไว้ในเบราว์เซอร์ และคุณเปิดการจัดรูปแบบอัตโนมัติได้หากอยากเห็นผลลัพธ์ขณะพิมพ์
เมื่อมีสิ่งผิดปกติ ข้อความแจ้งจะสั้นและตรงจุด บอกภาษา สิ่งที่ตัวแยกวิเคราะห์คาดหวัง รวมถึงบรรทัดและคอลัมน์ ข้อมูลที่คุณใส่จะไม่ถูกเขียนทับ และมีปุ่มพาเคอร์เซอร์ไปยังจุดที่มีปัญหา ปุ่มเลิกทำช่วยเอาสิ่งที่เผลอล้างหรือแทนที่กลับมา คุณดาวน์โหลดผลลัพธ์ด้วยนามสกุลไฟล์ที่ถูกต้องตามภาษาได้ หรือเปิดทั้งสองเวอร์ชันเทียบข้างกันในเครื่องมือเปรียบเทียบข้อความเพื่อดูว่าเปลี่ยนอะไรไปบ้าง
ทุกอย่างเกิดขึ้นบนอุปกรณ์ของคุณ เอนจินจัดรูปแบบที่มีขนาดใหญ่จะถูกดาวน์โหลดเฉพาะภาษาที่คุณจัดรูปแบบจริง และทำงานในเวิร์กเกอร์เบื้องหลัง ไฟล์ใหญ่จึงไม่ทำให้หน้าเว็บค้าง โปรดทราบข้อจำกัด เปิดไฟล์ได้ไม่เกิน 5 MB ข้อมูลเกิน 300,000 ตัวอักษรอาจใช้เวลาสักครู่ และข้อมูลเกินสองล้านตัวอักษรจะถูกปฏิเสธ การจัดรูปแบบไม่ใช่ linter หรือคอมไพเลอร์ จึงไม่พบข้อผิดพลาดด้านตรรกะ และไวยากรณ์แปลก ๆ บางอย่างอาจถูกปฏิเสธ
คำถามที่พบบ่อย
โค้ดของฉันถูกอัปโหลดไปที่ไหนหรือไม่
ไม่ โค้ดถูกจัดรูปแบบโดยไลบรารีที่ทำงานภายในเบราว์เซอร์ของคุณในเธรดเบื้องหลัง ไม่มีอะไรถูกส่งไปยังเซิร์ฟเวอร์ เบราว์เซอร์เก็บเฉพาะการตั้งค่าและฉบับร่างที่คุณเลือกบันทึกไว้ในที่เก็บข้อมูลในเครื่อง และคุณล้างช่องได้ทุกเมื่อ
การจัดรูปแบบจะเปลี่ยนสิ่งที่โค้ดทำหรือไม่
ตัวจัดรูปแบบเปลี่ยนเฉพาะหน้าตา ได้แก่ การเยื้อง การขึ้นบรรทัดใหม่ และช่องว่าง อาจปรับเครื่องหมายคำพูดให้เหมือนกัน เพิ่มหรือลบวงเล็บที่ไม่จำเป็น และใส่อัฒภาคให้สม่ำเสมอด้วย แต่ความหมายของโค้ดยังเหมือนเดิม เครื่องมือนี้ไม่ตรวจตรรกะ ชนิดข้อมูล หรือกฎของ lint ดังนั้นโค้ดที่ถูกต้องจะยังถูกต้อง ส่วนโค้ดที่ผิดก็ยังผิดอยู่
ตรวจจับภาษาอย่างไร
ถ้าเปิดไฟล์ จะใช้นามสกุลไฟล์เป็นตัวตัดสิน หากไม่ใช่ เครื่องมือจะดูที่ตัวข้อความเอง เช่น แท็ก วงเล็บปีกกา คีย์เวิร์ด และเครื่องหมายวรรคตอนที่พบบ่อย เมื่อสองภาษาคล้ายกัน เช่น CSS กับ SCSS หรือ JavaScript กับ TypeScript เครื่องมือจะถามคุณแทนการเดา และคุณเลือกภาษาเองได้เสมอจากรายการภาษา
จะเกิดอะไรขึ้นถ้าโค้ดมีข้อผิดพลาดด้านไวยากรณ์
ช่องผลลัพธ์จะว่างเปล่า ข้อมูลที่คุณใส่จะอยู่เหมือนเดิมทุกประการ และคุณจะเห็นข้อความสั้น ๆ บอกบรรทัดกับคอลัมน์ กดปุ่มแสดงในช่องใส่โค้ดเพื่อข้ามไปยังจุดนั้น แก้ไข แล้วกดจัดรูปแบบอีกครั้ง
บีบอัดโค้ดที่นี่ได้ไหม
ได้เฉพาะ JSON ซึ่งการลบช่องว่างปลอดภัยเสมอ การบีบอัด JavaScript หรือ CSS ให้ถูกต้องต้องใช้เครื่องมือบีบอัดโดยเฉพาะ เพราะการเปลี่ยนชื่อตัวแปรหรือรวมกฎอาจเปลี่ยนพฤติกรรมของโค้ด เครื่องมือนี้จึงไม่ทำ หากต้องการตรวจไวยากรณ์ SQL ให้ละเอียดขึ้น ให้ใช้ตัวจัดรูปแบบและตรวจสอบ SQL