Softonic

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

ขั้นตอน 1 / 3 .editorconfig
ภาษาที่ใช้ในโปรเจกต์นี้

เลือกอีโคซิสเต็มที่มีอยู่ในรีโพซิทอรีของคุณ แต่ละรายการจะเพิ่มเซกชันพร้อมกฎที่อีโคซิสเต็มนั้นต้องการ

ถัดไป

ไฟล์ .editorconfig ที่รากของรีโพซิทอรีจะบอก IDE รุ่นใหม่ทุกตัวว่าโปรเจกต์นี้จัดรูปแบบไฟล์อย่างไร และยุติข้อถกเถียงเรื่องแท็บกับช่องว่างเป็นรายไฟล์ไป ส่วนที่ยากไม่ใช่บล็อกส่วนกลาง แต่เป็นเซกชันที่แยกตามภาษา เพราะ YAML เยื้องด้วยแท็บไม่ได้เลย make ไม่ยอมรับบรรทัดคำสั่งของ recipe ที่ขึ้นต้นด้วยช่องว่าง และสคริปต์เชลล์ที่บันทึกด้วย CRLF ก็รันไม่ได้ เลือกภาษาที่มีอยู่ในรีโพซิทอรีของคุณ แล้วเครื่องมือนี้จะเขียนเซกชันที่แต่ละภาษาต้องการให้ พร้อมหมายเหตุข้าง ๆ ที่อธิบายว่าทำไมต้องมีเซกชันนั้น

วิธีสร้างไฟล์ .editorconfig

  1. 1

    เลือกภาษาที่มีอยู่ในรีโพซิทอรีของคุณ

    JavaScript, JSON, HTML และ CSS, YAML, Python, PHP, Go, Rust, Ruby, Java, Markdown, Makefile, สคริปต์เชลล์ และไฟล์แบตช์ของ Windows แต่ละรายการที่คุณติ๊กจะเพิ่มเซกชันหนึ่งเซกชัน

  2. 2

    ตั้งกฎที่ทุกไฟล์สืบทอดไปใช้

    สไตล์และขนาดการเยื้อง การจบบรรทัด ชุดอักขระ การขึ้นบรรทัดใหม่ท้ายไฟล์ ช่องว่างท้ายบรรทัด และขีดจำกัดความยาวบรรทัด ทั้งหมดนี้จะอยู่ในบล็อก `[*]` ด้านบนสุด ส่วนเซกชันด้านล่างจะแทนที่เฉพาะสิ่งที่ภาษานั้นต้องการจริง ๆ เท่านั้น

  3. 3

    อ่านเหตุผลที่ต้องมีแต่ละเซกชัน

    ตารางข้างไฟล์จะอธิบายทุกเซกชันที่เครื่องมือเขียนให้ คุณจึงตัดเซกชันที่ทีมของคุณไม่ต้องการออกได้ก่อนคอมมิต

  4. 4

    คัดลอกไปไว้ที่รากของรีโพซิทอรี

    บันทึกเป็นไฟล์ `.editorconfig` ไว้ข้าง ๆ `.gitignore` ของคุณ โปรแกรมแก้ไขจะเริ่มใช้กฎทันทีที่คุณเปิดไฟล์ถัดไป ไม่ต้องมีขั้นตอนบิลด์ ไม่ต้องตั้งค่าปลั๊กอิน

ไฟล์ .editorconfig ทำหน้าที่อะไร

ไฟล์ชื่อ .editorconfig ที่วางไว้ที่รากของโปรเจกต์จะประกาศธรรมเนียมการจัดรูปแบบเอาไว้ โปรแกรมแก้ไขที่รองรับ EditorConfig (IDE หลักทุกตัวและโปรแกรมแก้ไขข้อความรุ่นใหม่ส่วนใหญ่) จะนำกฎเหล่านั้นมาใช้เมื่อเปิดไฟล์ การค้นหาจะไล่ขึ้นไปตามโครงสร้างไดเรกทอรีจากไฟล์ที่กำลังแก้ไข และหยุดที่ไฟล์แรกที่ระบุว่า root = true

ตัวอย่างผลลัพธ์

ด้วยค่าเริ่มต้น (ช่องว่าง, ขนาดการเยื้อง 4, LF, utf-8) และเซกชันสองรายการที่ติ๊กไว้ให้ล่วงหน้า เครื่องมือจะสร้างไฟล์ออกมาดังนี้:

root = true

[*]
indent_style = space
indent_size = 4
end_of_line = lf
charset = utf-8
trim_trailing_whitespace = true
insert_final_newline = true
max_line_length = 120

[*.{md,markdown}]
trim_trailing_whitespace = false

[{Makefile,makefile,GNUmakefile,*.mk}]
indent_style = tab

ติ๊ก Python, Go หรือ YAML แล้วเซกชันที่ตรงกันจะปรากฏด้านล่าง พร้อมธรรมเนียมที่ตัวจัดรูปแบบของอีโคซิสเต็มนั้นบังคับใช้อยู่แล้ว

ไดเรกทิฟหลัก

ไดเรกทิฟ ค่าที่รับได้ หมายเหตุ
root true ตั้งไว้ที่รากของโปรเจกต์ เพื่อให้การค้นหาหยุดที่นั่น
charset latin1, utf-8, utf-8-bom, utf-16be, utf-16le utf-8 คือค่าที่ใช้กันทั่วไป ข้อกำหนดไม่แนะนำให้ใช้เครื่องหมายลำดับไบต์ ส่วน utf-16 ทั้งสองแบบมีผลกับทุกไฟล์ ซึ่งเครื่องมือบิลด์ส่วนใหญ่อ่านไม่ได้
end_of_line lf, crlf, cr lf สำหรับงานข้ามแพลตฟอร์ม ส่วน crlf ใช้เฉพาะรีโพซิทอรีที่ใช้บน Windows เท่านั้น
indent_style space, tab
indent_size จำนวนเต็ม หรือ tab เมื่อใช้ indent_style = tab ค่านี้ไม่ได้ถูกละเว้น เพราะ tab_width จะย้อนกลับมาใช้ค่านี้ จึงเป็นตัวกำหนดความกว้างที่แท็บแสดงผล
tab_width จำนวนเต็ม แทบไม่ต้องใช้ เพราะค่าเริ่มต้นเท่ากับ indent_size
insert_final_newline true, false ทำให้ไฟล์เป็นไปตามมาตรฐาน POSIX และ diff ไม่มีบรรทัดรบกวน
trim_trailing_whitespace true, false ปิดสำหรับ Markdown ซึ่งช่องว่างท้ายบรรทัดหมายถึงการขึ้นบรรทัดใหม่
max_line_length จำนวนเต็มบวก หรือ unset ไม่ได้อยู่ในข้อกำหนดหลัก แต่อยู่ในหน้าวิกิรวมพร็อพเพอร์ตี หากไม่ต้องการขีดจำกัด ให้ตัดบรรทัดนี้ออกไปเลย ดีกว่าเขียน 0

กฎสามข้อที่ทำให้บิลด์พัง ไม่ใช่แค่ผิดสไตล์ไกด์

รายการส่วนใหญ่ใน .editorconfig เป็นเรื่องความชอบส่วนตัว แต่สามข้อนี้ไม่ใช่ และนี่คือเหตุผลที่การมีเซกชันแยกตามภาษานั้นคุ้มค่า:

  • YAML ห้ามใช้อักขระแท็บในการเยื้อง นี่คือข้อผิดพลาดตอนแยกวิเคราะห์ ไม่ใช่คำเตือนจากลินเตอร์ หากโปรเจกต์ของคุณเยื้องด้วยแท็บ และมีไฟล์เวิร์กโฟลว์ของ GitHub Actions ไฟล์ Docker Compose หรือไฟล์ manifest ของ Kubernetes อยู่ เซกชัน YAML จำเป็นต้องบังคับให้กลับมาใช้ช่องว่าง
  • make ต้องการอักขระแท็บจริง ๆ ที่ต้นบรรทัดคำสั่งของ recipe ทุกบรรทัด หากใช้ช่องว่างจะได้ missing separator. Stop. และการบิลด์จะหยุดลง นี่คือเหตุผลที่ [{Makefile,makefile,GNUmakefile,*.mk}] ระบุการสะกดไว้หลายแบบ เพราะ EditorConfig จับคู่ชื่อไฟล์แบบแยกตัวพิมพ์ใหญ่เล็ก และในรีโพซิทอรีต่าง ๆ ก็มีทั้ง Makefile และ makefile
  • สคริปต์เชลล์ที่บันทึกด้วย CRLF จะรันไม่ได้ เคอร์เนลจะอ่านอักขระคืนแคร่เป็นส่วนหนึ่งของพาธตัวแปลคำสั่ง แล้วรายงานออกมาประมาณว่า /bin/bash^M: bad interpreter: No such file or directory ส่วนไฟล์แบตช์ของ Windows ก็มีปัญหาในทางกลับกัน คือ cmd.exe ค้นหาตำแหน่งของ goto และ call :label ด้วยออฟเซ็ตระดับไบต์ ไฟล์ .bat ที่ใช้ LF อย่างเดียวจึงอาจกระโดดไปผิดบรรทัด หรือหยุดกลางคันโดยไม่แจ้งข้อผิดพลาดใด ๆ เลย

สองข้อในนั้นเกิดขึ้นได้เพราะบล็อกส่วนกลางเอง แทนที่จะถูกแก้ด้วยบล็อกส่วนกลาง เครื่องมือนี้จึงคอยเฝ้าระวังให้ หากคุณเลือกแท็บแต่ไม่ได้เพิ่มเซกชัน YAML หรือเลือก CRLF แต่ไม่ได้เพิ่มเซกชันเชลล์ ไฟล์ที่เครื่องมือเขียนออกมาจะทำให้ไฟล์เหล่านั้นพัง ทั้งที่ไม่เคยถูกเอ่ยถึงในไฟล์เลยสักครั้ง เครื่องมือจะแจ้งไว้เหนือผลลัพธ์ แทนที่จะปล่อยให้คุณไปรู้เอาตอนไปป์ไลน์ล้มเหลว ชุดอักขระ utf-16 ก็เช่นเดียวกัน เพราะมีผลกับทุกไฟล์ในโปรเจกต์ และ make ตัวแปลคำสั่งเชลล์ รวมถึง Python ก็อ่านซอร์สโค้ดที่บันทึกแบบนั้นไม่ได้

ธรรมเนียมของแต่ละภาษาที่เครื่องมือนี้เขียนให้

ภาษาหรือไฟล์ เซกชัน ตั้งค่าอะไรและเพราะอะไร
JavaScript, TypeScript *.{js,jsx,mjs,cjs,ts,tsx} 2 ช่องว่าง ตามค่าเริ่มต้นของ Prettier
JSON *.{json,jsonc} 2 ช่องว่าง ความกว้างที่ npm เขียนลงใน package.json
HTML, CSS, เทมเพลต *.{html,htm,css,scss,sass,less,vue,svelte} 2 ช่องว่าง และไวยากรณ์แบบเยื้องของ Sass ก็ต้องใช้จึงจะแยกวิเคราะห์ได้
YAML *.{yml,yaml} 2 ช่องว่าง และใช้ช่องว่างเสมอแม้โปรเจกต์จะใช้แท็บ
Python *.{py,pyi} 4 ช่องว่าง ตาม PEP 8 และ Black
PHP *.php 4 ช่องว่าง ตาม PSR-12 ส่วน WordPress ใช้แท็บ และ Drupal ใช้ 2
Go {*.go,go.mod} แท็บ เพราะ gofmt เยื้องด้วยแท็บ
Rust *.rs 4 ช่องว่าง ตามค่าเริ่มต้นของ rustfmt
Ruby {*.rb,*.rake,Gemfile,Rakefile} 2 ช่องว่าง ตามค่าเริ่มต้นของ RuboCop
Java *.java 4 ช่องว่าง ตามธรรมเนียมของ Oracle ส่วนสไตล์ Java ของ Google ใช้ 2
Markdown *.{md,markdown} คงช่องว่างท้ายบรรทัดไว้ ซึ่งเป็นวิธีขึ้นบรรทัดใหม่ของ Markdown
Makefile {Makefile,makefile,GNUmakefile,*.mk} แท็บ ตามที่ make กำหนด
สคริปต์เชลล์ *.{sh,bash,zsh} LF ไม่ว่าส่วนที่เหลือของโปรเจกต์จะใช้อะไร
ไฟล์แบตช์ของ Windows *.{bat,cmd} CRLF เพราะ cmd.exe ค้นหาตำแหน่งของ label ด้วยออฟเซ็ตระดับไบต์

สังเกตสิ่งที่ไม่มีอยู่ในตารางนั้น นั่นคือความยาวบรรทัด PEP 8 บอกไว้ที่ 79, Black บอก 88, PSR-12 บอก 120 แบบยืดหยุ่น และ rustfmt บอก 100 การเขียนตัวเลขใดตัวเลขหนึ่งลงในเซกชันของภาษาจะไปแทนที่ขีดจำกัดที่คุณเลือกไว้สำหรับทั้งโปรเจกต์อย่างเงียบ ๆ เครื่องมือนี้จึงคง max_line_length ไว้ในบล็อก [*] เท่านั้น และเก็บตัวเลขเหล่านั้นไว้ตรงนี้ เพื่อให้คุณเลือกนำไปใช้เองอย่างตั้งใจ

โปรแกรมแก้ไขของคุณรองรับหรือไม่

รองรับในตัว: VS Code, ตระกูล IntelliJ ของ JetBrains, Visual Studio, Sublime Text, Xcode และ Notepad++ ส่วน Vim, Emacs, Neovim และอีกไม่กี่ตัวต้องติดตั้งปลั๊กอินเล็ก ๆ เพิ่ม ไฟล์นี้เป็นรูปแบบ INI ธรรมดา ลินเตอร์และตัวจัดรูปแบบจึงอ่านได้ด้วย ซึ่งเป็นวิธีที่ Prettier และ language server บางตัวใช้ยึดค่าให้ตรงกัน

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

วางไว้ที่รากของโปรเจกต์ พร้อมใส่ root = true ไว้บรรทัดบนสุด คุณสามารถเพิ่มไฟล์ .editorconfig ในไดเรกทอรีย่อยเพื่อแทนที่กฎของบางเส้นทางได้ การค้นหาจะไล่ขึ้นไปตามโครงสร้างจากไฟล์ที่กำลังแก้ไข และหยุดที่ root = true ตัวแรกที่พบ

ตั้งช่องนั้นเป็น 0 แล้วเครื่องมือจะไม่ใส่ max_line_length ลงในไฟล์ ค่าที่มีเอกสารระบุไว้สำหรับพร็อพเพอร์ตีนี้คือจำนวนเต็มบวก บวกกับ unset ที่ใช้ได้กับทุกพร็อพเพอร์ตีตามข้อกำหนด ซึ่งมีไว้ยกเลิกค่าที่สืบทอดมาจากไฟล์แม่ แต่ไฟล์นี้เป็นไฟล์ระดับบนสุด จึงไม่มีอะไรให้ยกเลิก และการไม่มีบรรทัดนั้นก็สื่อความหมายเดียวกัน สิ่งที่ไม่ควรเขียนคือ max_line_length = 0 ซึ่งเป็นสิ่งที่เครื่องมือนี้เคยทำ เพราะข้อกำหนดบอกให้ปลั๊กอินละเว้นค่าที่ไม่รองรับ ขีดจำกัดที่เป็นศูนย์จึงไม่ได้แปลว่าจำกัดไว้ที่ศูนย์ แต่เป็นบรรทัดที่ไม่มีผลอะไรเลย

ไม่ EditorConfig ดูแลเรื่องช่องว่างและการจบบรรทัดในโปรแกรมแก้ไขทุกตัว รวมถึงตัวที่เพื่อนร่วมทีมใช้แต่คุณไม่ได้ใช้ด้วย ส่วน Prettier และลินเตอร์เฉพาะภาษาจะจัดการกฎสไตล์ที่ลึกกว่า เช่น เครื่องหมายคำพูด อัฒภาค และจุลภาคท้ายรายการ ทั้งสองอย่างเสริมกัน และ Prettier เองก็จะอ่าน .editorconfig ของคุณสำหรับค่าพื้นฐาน

เพราะ YAML ไม่อนุญาตให้ใช้อักขระแท็บในการเยื้องเลยแม้แต่น้อย ไฟล์เวิร์กโฟลว์หรือไฟล์ compose ที่เยื้องด้วยแท็บจะแยกวิเคราะห์ไม่ผ่านตั้งแต่ก่อนที่เครื่องมือใดจะได้เห็นมัน เครื่องมือนี้จะคงแท็บของคุณไว้ในทุกที่ และแทนที่เฉพาะเซกชัน YAML เท่านั้น พร้อมแจ้งให้ทราบไว้เหนือไฟล์เมื่อทำเช่นนั้น

ตั้ง end_of_line = crlf หากเครื่องมือฝั่ง Windows ในรีโพซิทอรีจำเป็นต้องใช้จริง ๆ แต่ทางเลือกที่ดีกว่ามักเป็นการใช้ lf ตรงนี้ ร่วมกับไฟล์ .gitattributes ที่มี * text=auto เพื่อให้ git ปรับการจบบรรทัดให้เป็นมาตรฐานตอนคอมมิต ขณะที่การเช็กเอาต์ยังได้รูปแบบที่เหมาะกับแต่ละระบบปฏิบัติการ

ตัวเลือกของคุณใช้สร้างไฟล์ และเดินทางไปกับลิงก์ของหน้าเว็บระหว่างแต่ละขั้นตอน คุณจึงแชร์หรือบุ๊กมาร์กการตั้งค่าหนึ่ง ๆ ได้ และไม่มีการจัดเก็บข้อมูลใดไว้บนเซิร์ฟเวอร์ของเราหลังจากสร้างหน้านี้แล้ว

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

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

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

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

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

เครื่องสุ่มที่อยู่

สร้างระเบียนคล้ายที่อยู่ 1–20 รายการสำหรับแบบจำลองและการทดสอบ ด้วยรูปแบบประเทศแบบย่อ

ตัวลดรูปพีชคณิตบูลีน

ประเมินนิพจน์บูลีนสำหรับทุกชุดอินพุตและดูตารางค่าความจริงที่สมบูรณ์ รองรับตัวแปรสูงสุดห้าตัวและตัวดำเนินการ &, |, !, ^

ตัวสร้างลูกศร CSS

สร้างลูกศร CSS ในเบราว์เซอร์ด้วยทิศทาง สี ขนาด และความหนาของเส้นขอบ แล้วคัดลอกกฎ.

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

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

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