正確設定的編輯器可以使程式碼更清晰易讀，並且撰寫速度更快。它甚至可以幫助您在撰寫程式碼時就發現錯誤！如果這是您第一次設定編輯器，或者您正在尋找調整目前編輯器的方法，我們有一些建議。
您將學習到
- 最流行的編輯器有哪些
- 如何自動格式化程式碼
你的編輯器
VS Code 是目前最流行的編輯器之一。它有一個龐大的擴充程式市集，並且可以良好地與 GitHub 等熱門服務整合。下方列出的大多數功能也可以作為擴充程式新增到 VS Code 中，使其具有高度可配置性！
React 社群中使用的其他熱門文字編輯器包括
- WebStorm 是一款專為 JavaScript 設計的整合式開發環境。
- Sublime Text 支援 JSX 和 TypeScript，內建語法高亮和自動完成功能。
- Vim 是一款高度可配置的文字編輯器，旨在高效地建立和更改任何類型的文字。大多數 UNIX 系統和 Apple OS X 都包含它作為 “vi”。
建議的文字編輯器功能
有些編輯器內建了這些功能，但其他編輯器可能需要新增擴充程式。請檢查您選擇的編輯器提供了哪些支援，以確保萬無一失！
程式碼檢查 (Linting)
程式碼檢查工具會在您撰寫程式碼時發現問題，幫助您及早修復它們。ESLint 是一款熱門的開源 JavaScript 程式碼檢查工具。
請確保您已為您的專案啟用所有 eslint-plugin-react-hooks 規則。它們非常重要，可以及早發現最嚴重的錯誤。建議的 eslint-config-react-app 預設值已包含它們。
格式化
當您與其他貢獻者分享程式碼時，最不希望發生的事情就是討論空格鍵與Tab鍵的差異！幸好，Prettier 會透過將程式碼重新格式化以符合預設的可配置規則來清理您的程式碼。執行 Prettier 後，所有 Tab 鍵都會轉換為空格鍵，而且您的縮排、引號等也都會更改為符合設定。在理想的設定中，Prettier 會在您儲存檔案時執行，快速為您進行這些編輯。
您可以按照以下步驟安裝 VSCode 的 Prettier 擴充功能
- 啟動 VS Code
- 使用快速開啟（按下 Ctrl/Cmd+P）
- 貼上
ext install esbenp.prettier-vscode - 按下 Enter 鍵
儲存時格式化
理想情況下，您應該在每次儲存時都格式化程式碼。VS Code 有相關的設定！
- 在 VS Code 中，按下
CTRL/CMD + SHIFT + P。 - 輸入「settings」
- 按下 Enter 鍵
- 在搜尋列中，輸入「format on save」
- 確保已勾選「format on save」選項！
如果您的 ESLint 預設值有格式化規則，它們可能會與 Prettier 衝突。我們建議您使用
eslint-config-prettier停用 ESLint 預設值中的所有格式化規則，讓 ESLint *僅* 用於捕捉邏輯錯誤。如果您想要強制在合併 Pull Request 之前格式化檔案，請在您的持續整合中使用prettier --check。