Prettier 是程式碼格式化工具,可設定為存檔時自動格式化,不用再浪費時間手動格式化程式碼。同時也能夠統一團隊程式碼風格,並且可以根據團隊規範,去調整相關設定規則。
Prettier 的共用指令
--write 直接寫入所有已處理的文件,可使用縮寫 -w。
參考線上文件 Prettier 程式碼格式化工具 取用現在名下。
1 2 3 4 5 6 7 | printWidth: 120 # 程式碼寬度. tabWidth: 2 # Tab 轉換為多少空白. semi: true # 結尾加分號(;). singleQuote: true # 統一使用單引號. trailingComma: 'all' # 使用逗號(,)結尾. bracketSpacing: false # 大括號({})前後是否加空格 arrowParens: 'always' # 箭頭函數內的參數只有一個永遠加括號. |
Prettier 的插件
plugin-php
plugin-php GitHub
主要針對 PHP 的文件檔做格式自動化處理,可透過線上展示 (Playground) ,透過指令的設定來操作輸出的風格。
安裝方法
共有 yarn 與 npm 套件管理的安裝方式安裝,主要有分全域與專案使用。
1 2 3 | yarn add --dev prettier @prettier/plugin-php # or globally yarn global add prettier @prettier/plugin-php |
1 2 3 | npm install --save-dev prettier @prettier/plugin-php # or globally npm install --global prettier @prettier/plugin-php |
使用
如果使用 Node.js 與 Npm 的話,在 package.json 檔中加入指令,這樣的方式主要是在專案中使用的方式。
1 2 3 4 5 | { "scripts": { "prettier": "prettier" } } |
如果要執行指令,輸入下面指令。
1 2 3 | yarn run prettier path/to/file.php --write # or npm run prettier -- path/to/file.php --write |
如果以全域的方式,要執行 Prettier plugin-php 指令,就不需要再下 npm run,直接以 prettier 開頭在終端機下指令就可運行。
1 | prettier path/to/file.php --write |
配置
較詳細的說明就不列出,主要有份 CLI 與 API 撰寫 (Override) 方式,要特別注意一下小寫與小駝峰的寫法,使用 CLI 都是小寫中間會透過 - 連結單字,而 API 的部份多為小駝峰的寫法。
phpVersion:
指定 PHP 版本,如使用近代 7.1 或更高版本做為輸出,但如果像是使用 PHP 5.3 或更低版本,需設定此選項否則會產生不相容的程式碼。
"5.4" 預設
--php-version CLI 寫法。
tabWidth:
空隔字元數,在預設是 4 個,而在 Prettier 官方是 2 個字元。
--tab-width <int> CLI 寫法。
tabWidth: <int> API 寫法。
--single-quote:
使用單引號 "" 或是雙引號 ""。
false 預設
--single-quote CLI 寫法。
singleQuote: <bool> API 寫法。
--trailing-comma-php:
陣列結尾是否要使用 , 逗號。
true 預設
braceStyle:
讓函式、方法、物件的大括號進行斷行與不斷行處理。
--brace-style CLI 寫法。
braceStyle API 寫法。
"psr-2" 預設
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 | <?php class Pokemon { // $hp 預設值為 100,$attack 為 30 public $hp = 100; public $attack = 30; // attacked 函式可接收 1 個參數,如果傳入 10,則 Pokemon 本身的 hp 會減 10 public function attacked($attack) { $this->hp -= $attack; } // evolve 函式不需任何參數,可讓 Pokemon 本身的 hp 和 attack 乘於 2 public function evolve() { $this->hp *= 2; $this->attack *= 2; } // getHp 函式不需任何參數,可回傳 Pokemon 本身的 hp public function getHp() { return $this->hp; } } $pokemon = new Pokemon(); echo $pokemon->attacked(20) . "\r\n"; // 受 20 點攻擊 echo $pokemon->evolve() . "\r\n"; // 被攻擊後的寶可夢進化,攻擊力與 HP 都加二倍 echo $pokemon->getHp() . "\r\n"; // 取得進化寶可夢的 HP -> 160 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 | <?php class Pokemon { // $hp 預設值為 100,$attack 為 30 public $hp = 100; public $attack = 30; // attacked 函式可接收 1 個參數,如果傳入 10,則 Pokemon 本身的 hp 會減 10 public function attacked($attack) { $this->hp -= $attack; } // evolve 函式不需任何參數,可讓 Pokemon 本身的 hp 和 attack 乘於 2 public function evolve() { $this->hp *= 2; $this->attack *= 2; } // getHp 函式不需任何參數,可回傳 Pokemon 本身的 hp public function getHp() { return $this->hp; } } $pokemon = new Pokemon(); echo $pokemon->attacked(20) . "\r\n"; // 受 20 點攻擊 echo $pokemon->evolve() . "\r\n"; // 被攻擊後的寶可夢進化,攻擊力與 HP 都加二倍 echo $pokemon->getHp() . "\r\n"; // 取得進化寶可夢的 HP -> 160 |