📝 Coding Style 技能
規範索引
| 語言 | 規範 | 說明 |
|---|---|---|
| JavaScript - Airbnb | 最流行、嚴格 | |
| JavaScript - Standard | 無分號風格 | |
| TypeScript | TypeScript 特定規範 | |
| PHP - PSR-12 | PHP 官方標準 | |
| PHP - Laravel | Laravel 風格 | |
| Python - PEP8 | Python 官方標準 | |
| CSS - BEM | 命名規範 |
共通原則
命名規範
| 類型 | JavaScript | PHP | Python |
|---|---|---|---|
| 變數 | camelCase | $camelCase | snake_case |
| 函式 | camelCase | camelCase | snake_case |
| 類別 | PascalCase | PascalCase | PascalCase |
| 常數 | UPPER_SNAKE | UPPER_SNAKE | UPPER_SNAKE |
格式化
| 項目 | 建議 |
|---|---|
| 縮排 | 2 或 4 空格(依語言) |
| 行寬 | 80-120 字元 |
| 檔案結尾 | 保留空行 |
| 引號 | 統一使用單引號或雙引號 |
工具設定
ESLint + Prettier (JS/TS)
json
// .eslintrc.json
{
"extends": [
"eslint:recommended",
"plugin:@typescript-eslint/recommended",
"prettier"
],
"parser": "@typescript-eslint/parser"
}
json
// .prettierrc
{
"semi": true,
"singleQuote": true,
"tabWidth": 2,
"trailingComma": "es5"
}
EditorConfig
ini
# .editorconfig
root = true
[*]
indent_style = space
indent_size = 2
end_of_line = lf
charset = utf-8
trim_trailing_whitespace = true
insert_final_newline = true
[*.{php,py}]
indent_size = 4
Git Hooks
json
// package.json
{
"husky": {
"hooks": {
"pre-commit": "lint-staged"
}
},
"lint-staged": {
"*.{js,ts,tsx}": ["eslint --fix", "prettier --write"],
"*.css": ["stylelint --fix"]
}
}
選擇精靈
不確定用什麼規範?使用 Coding Style 精靈