---
# System prepended metadata

title: 代碼風格

---

# 代碼風格

使用 [ESLint](https://eslint.org/docs/rules/) + [Vue ESlint](https://eslint.vuejs.org/rules/) + [Prettier](https://prettier.io/docs/en/options.html) 做代碼風格及排版統一。

## ESLint + Vue ESlint

設定及說明在專案中的 .eslintrc.js 檔。

## Prettier

| 規則名稱 | 說明 | 值 |
| ---------- | -------------------- | -- |
| printWidth | 每行最多字數，超過會換行。 | 80 |
| tabWidth   | 縮排每階層空白格數。 | 2 |
| tabs       | 點擊 tab 鍵縮拍時，是否使用 tab。<br><br>true: 使用 Tab<br>false: 使用空白 | false |
| semicolons | 結尾是否使用分號。 | false |
| quotes  | 是否使用單引號。<br><br>true: 使用單引號<br>false: 使用雙引號 | true |
| bracketSpacing | Object 大括號內的開頭及結尾是否需要加空白 | true |
| arrowParens | 箭頭函式如果只有單一參數時，參數是否需要加括號。<br><br>always: 加括號<br>avoid: 不加括號 | avoid |

