WordPressのコーディング規約は割と特殊だ。
例えばif文の書き方一つにしても
↑は正しく、
↑はコーディング規約違反である。()の中は前後一文字のスペースを入れるのが規約だからだ。
こういう細かいのをレビュー時に人出で潰すのは馬鹿げている。
エディターで書いている途中で自動で検出できるようにする。
目次
環境
Macが前提です。UbuntuやWIndowsは適宜読み替えてくれ。
- OS: Mac OS Ver 10.13.6
- エディター: Visual Studio Code
完成版
コーディング規約違反をすると、下記のようにエラーが出る。
![](https://static.yhei-web-design.com/wp-content/uploads/2020/04/34fcd118edb92804a882dcb83760e9b5-1024x678.png)
エラー文に従い直していけば、自然と規約を守ったコーディングができるようになる。レビュー時に規約について気にする必要がなくなり、ロジックのレビューに集中できるのが良い。
やること
- composerインストール
- phpcsのインストール
- Visual Studio Codeの設定
Composerインストール
phpcsのインストール
Visual Studio Codeの設定
phpcs拡張機能をインストール
Command + Shift + Xで拡張機能画面を開く。
![](https://static.yhei-web-design.com/wp-content/uploads/2020/04/88b436c9bf69bb809e21197e37d7cded.png)
phpcs と検索し、Ioannis Kappas の方をインストール。
![](https://static.yhei-web-design.com/wp-content/uploads/2020/04/939c8171945c7b86f9fc956f67a3f2bb.png)
phpcs拡張機能の設定
Command + , で設定を開く。
![](https://static.yhei-web-design.com/wp-content/uploads/2020/04/e8eff4cf9f69fb05d97756500b0ae33c-1024x537.png)
「設定の検索」フィールドに、phpcsと入力。ユーザーに設定すると全てのコードに適用されてしまうため、ワークスペース単位で設定するのを推奨する。
![](https://static.yhei-web-design.com/wp-content/uploads/2020/04/9e378cfcb15d85bbc334772460ac4606-1024x556.png)
「settings.jsonで編集」をクリック。
settings の項目に下記を入力。ユーザー名は各々の環境で置き換える。
phpcs.standardの部分をPSR2などに変更すると、別の規約に変更できる。
結果
![VisualStudioCodeでWordPressのコーディングチェック](https://static.yhei-web-design.com/wp-content/uploads/2020/04/34fcd118edb92804a882dcb83760e9b5-1024x678.png)
問題タブにエラー内容が出るようになる。
チーム開発でphpcsを必須にすれば、一定の品質を維持できる。コーディング規約なんてだいたい守れないので、ツールで自動化した方が良い。
まとめ
phpcsを使うと
- phpcs+Visual Studio CodeでWordPressの規約違反をチェックできる
- WordPressだけでなく、他の規約もチェック可能
- ツールで規約チェックを自動化すると余分なレビュー工数を削減できる
おすすめ。チーム開発時に是非導入してくれ。