PHP_CodeSniffer ツールを使ったWordPressコーディングチェック（MacOSX編）

/ 5月 8, 2014

WP Total Hacksプラグインなどの開発者宮内氏のつぶやきから本ツールの存在を知りました、感謝です！

基本的に宮内氏の書かれた

を見れば、インストール方法（末尾）も含めて記載されています。

でもどうやっていれるの？つまづく人もいるよね？

私自身は、実践したことの詳細な備忘録という位置づけです。書くことで記憶度を深めているのです。
が、composerを入れたり、パスを通したり、、、どうやるのっていうレベルな場合には、使えるようになる過程のどこかで躓くと思います。開発者なら、自力で探せよ。。。ごもっとも！ これを読んでいるのが開発者なら、こんなものを読まずに、まずは自分でやってみましょう。それが習得の第一歩だと思います（開発者は回答を得る過程も大事！）。

とはいえWordPressのプラグインに限って言えば、もう少し敷居は低いかなと思います。

  • 関数もかなり豊富で、一から全部コーディングする必要もない
  • デザイナーだってコーディングするよ！（テーマ内とか）

などなど、プログラマーだけがコーディングしているわけじゃないですしね。
そして折角コーディングされるなら、きれいなコーディングが環境に（ボソ・・・後から見る人にとっても）優しいわけです。そこでMacOSX限定ですが（Windowsとか説明しだすと面倒だし、、）、インストールからどうやって使うかまでを丁寧に説明してみます。
※筆者はcomposer使ってないので、pearを使った導入方法を紹介します。

  1. Step 1 「ターミナル」アプリを起動しましょう
  2. Step 2 「/usr/local/bin」に対するパスを設定しましょう
  3. Step 3. PHP_CodeSnifferのインストール
  4. Step 4. PHP_CodeSnifferに対して、WordPressのチェック設定をインストールする
  5. Step 5. 利用の方法
  6. トラブルシューティング
  7. 参考情報

Step 1 「ターミナル」アプリを起動しましょう

「アプリケーション」フォルダ→「ユーティリティ」フォルダ内にある、アレですよアレ。
Windowsユーザーがいう「まっくろ画面」ってやつです。ターミナルはデフォルトは何色だったかな。
私はバックは白で文字は黒にしてます（ってそれがデフォルトかどうか、カスタマイズし過ぎてわかんない）。

Step 2 「/usr/local/bin」に対するパスを設定しましょう

/usr/local/bin 以下にコマンドをインストールした時に、わざわざそのフォルダに移動せずとも、直接コマンドを叩けるようにするためです。たとえば今回「/usr/local/bin/pear」にpearツールを入れます。そのままでは毎回 /usr/local/bin/pear とタイプせねばなりません。これは面倒です。pear だけにしたいじゃん、その通り！それをやるのが「パスを通す」ってことです。

通常 /usr 以下にMacOSX標準コマンドが格納されています。
何もしなければここにpearもインストールされます。しかし、MacOSXのアップデートによって/usr以下は上書きされるおそれがあるのでお薦めしません。/usr/local 以下についてはユーザーが独自にインストールしたツールが入っているよという一種の約束事（UNIX系の）みたいなフォルダだとでも思ってください。

ターミナル標準設定の場合には、下記の手順をターミナルから実施してみてください。

  1. touch ~/.bash_profile と入れてEnterキーを押す
  2. open -a textedit ~/.bash_profile と入れてEnterキーを押す
  3. テキストエディタが開くので、
export PATH=$PATH:/usr/local/bin
alias wpcs="phpcs -p -s -v --standard=WordPress"

の２文をいれて保存します。
4. source ~/.bash_profile をして設定を読み込みましょう。
5. echo $PATH　と入れてEnterキーを押して、/usr/local/binが含まれていることを確認

上記説明

  1. ユーザーのホームディレクトリ（~/）以下に、隠しファイル「.bash_profile」ファイルを作成する
    ※すでに存在すればアクセス日時変更、なければ空ファイルの作成
  2. テキストエディタを用いて、.bash_profileファイルを開く
  3. 一行目はパスの追加設定、二行目はオプション付きのphpcsコマンドの省略コマンド設定（@miyauchiさ
    んの記事参照）
  4. ユーザーのホームディレクトリ直下にある「.bash_profile」を読み込む
  5. パスの現設定の値を表示

ターミナルを起動するとコマンドを受け付ける画面が出ます。
この処理を行っているのを「シェル（Shell）」といいます。これにはいろいろ種類がありますが、ターミナル標準のシェルは、「bash」というものが使われています。WindowsでいうMS-DOSプロンプト（真っ黒画面と一部では呼ばれている）のことですね。この各ユーザー設定変更は、ユーザーのホームディレクトリ直下にある「.bash_profile」に書き込みます。ちなみに全体設定は「/etc/profile」「/etc/bashrc」などが読み込まれてます。profileはshシェルと共用なんですけど、このあたりを書き出すと本筋に戻ってこれないような気がするのでやめときます。興味があれば検索すればいいかと。

Step 2「PEAR」をいれましょう

MacOSXにはすでにPHPがインストールされてます。
PEARとは、PHP Extension and Application Repositoryの略で、PHPプログラムへ拡張モジュールとかライブラリをインストールするツールです。PHP_CodeSnifferは、Pearツールを経由して簡単にインストールできます。
ということなので、Pearツールをまずはインストールしなければなりません。

ターミナルアプリから下記を一行入力してはEnterキーを押して実行します。

  1. mkdir /usr/local
  2. mkdir /usr/local/src
  3. mkdir /usr/local/src/pear
  4. cd /usr/local/src/pear
  5. curl -O http://pear.php.net/go-pear.phar
  6. sudo php -d detect_unicode=0 go-pear.phar
    ※パスワードを聞いてくるのでログインユーザーのパスワードを入れましょう。
    （本当は管理者権限をもつユーザーですけどね）
    ※初期設定を聞いてきます。変更点は次の２点
  7. 「1-11, ‘all’ or Enter to continue: 」と聞いてきます。
  8. 「1」をタイプしてEnter
  9. 「Installation base ($prefix) [/usr] : 」と聞いてくるので「/usr/local/pear」をタイプしてEnterを押しましょう
    スクリーンショット 2014-05-07 18.22.49
  10. 次に「4」をタイプしてEnter
  11. 「Binaries directory [$prefix/bin] :」と聞いてくるので「/usr/local/bin」をタイプしてEnter
    スクリーンショット 2014-05-07 18.24.09
  12. そうすると、1と4番目の設定が下記の図のように変わっているはず
    スクリーンショット 2014-05-07 16.03.32
  13. 問題なければ、何も入力せず「Enter」を押します。するとインストールが開始され、あっという間にインストールされるでしょう。
  14. pear version とタイプしてEnterを押すことで、インストールされているPearバージョンが出てきます。
    ※もしpearコマンドがないと出てきたら、念のため一度ターミナルを終了し、再度起動しなおしてみてください。

用語説明

  • mkdir：ディレクトリ（フォルダ）を作成するコマンド
  • /usr/local/src：/usr/local/srcには、UNIX系OSでは、ユーザーが追加するプログラムソースをいれておく場所として一般的に使われており、今回はこれに準じておきます。
  • cd：ディレクトリ（フォルダ）を移動するコマンド
  • curl：ダウンロードツールです。「 curl -O URL 」でその場にURL等のデータをダウンロードします。場所やファイル名を選びたければ、「curl URL > 保存ファイル名」とします。
  • sudo：管理者権限で、sudo の次に続くコマンドを実行します。ツールをインストールする、コアな設定変更をするなどのときに使われます。
  • Installation base ($prefix)：UNIX系では、インストールするベースとなるディレクトリ（フォルダ）についてprefixの値を参照します。prefixが/usr/localなら、マニュアルは/usr/local/man, ライブラリは/usr/local/lib、設定は/usr/local/etc、実行ファイルは/usr/local/binなど。
  • Binaries directory: バイナリディレクトリ – 実行ファイルの場所のことを意味します。マニュアルやライブラル等は基本的にそれぞれフォルダ分けして格納されています。バイナリディレクトリは通常パスが通った場所にします（じゃないとコマンドタイプするのが面倒）。

Step 3. PHP_CodeSnifferのインストール

ターミナルアプリから

  1. pear install PHP_CodeSniffer
  2. /usr/local/bin/phpcs -i と入力して、反応が返ってくるか確認（Command not foundにならない事）を確認。

これだけです。pear入れておいたら楽でしょう？

pearでインストールされているパッケージって？

  • pear list

で表示されます。

pearでインストールしたツールのアップデートは？

  • sudo pear upgrade-all

でインストールされているすべてのパッケージのアップデートが実行されます。
１つのパッケージのみアップデートしたい場合には、

  • sudo pear upgrade パッケージ名

となります。パッケージ名は、pear listで表示されます。

pear でインストールしたツールを削除したいんだが？

  • sudo pear uninstall パッケージ名

ですね。

Step 4. PHP_CodeSnifferに対して、WordPressのチェック設定をインストールする

PHP_CodeSnifferは本体ツールであり、いろいろなPHPコードのチェックが可能なようです。
WordPress同様、それ単体では機能がなくて設定ファイルをインストールしてあげねばなりません。

やることは、設定ファイルを
/usr/local/pear/share/pear/PHP/CodeSniffer/Standards/WordPress
というフォルダに入れる

ってことです。

gitコマンドをインストールしている場合

http://git-scm.com/downloads

からダウンロードしてインストールしたらコマンドも入ると思います。

  1. cd /usr/local/pear/share/pear/PHP/CodeSniffer/Standards/
  2. git clone https://github.com/WordPress-Coding-Standards/WordPress-Coding-Standards
  3. mv WordPress-Coding-Standards WordPress

gitコマンドがない場合

  1. https://github.com/WordPress-Coding-Standards/WordPress-Coding-Standards よりzipファイルをダウンロード
  2. ダウンロードしたzipファイルを展開（WordPress-Coding-Standardsフォルダが出来る）
  3. このフォルダを「WordPress」に名前変更
    ※以下ターミナルにて
  4. open /usr/local/pear/share/pear/PHP/CodeSniffer/Standards/
  5. 出てきたフォルダに「3」のWordPressフォルダを移動

Step 5. 利用の方法

さて実際の利用です。
MAMPをインストールしていて、

  • WordPressのインストール場所：htdocs→wordpressフォルダ
  • チェックしたいPHPファイル：wp-content/theme/twentyfourteen/sidebar.php

と過程します。WordPress標準テーマ「TwentyForteen」のサイドバーPHPをチェックするってことです。

  1. ターミナルを起動します
  2. cd /Applications/MAMP/htdocs/wordpress/wp-content/theme/twentyfourteen
    ※ちなみに上記のなが～いパスについては逐次入力不要です。一部いれて「Tab」を押せば候補が出てきます。１つしか候補がなければ、それが補完入力されますよ！
  3. wpcs sidebar.php
    ※wpcsはStep 2で「alias wpcs=”phpcs -p -s -v –standard=WordPress」と設定したから使える独自コマンドです。
    通常は「phpcs -p -s -v –standard=WordPress sidebar.php」となります。

で結果は、、、

--------------------------------------------------------------------------------
FOUND 1 ERROR(S) AFFECTING 1 LINE(S)
--------------------------------------------------------------------------------
 13 | ERROR | Incorrect indentation; expected 0 space, found 2
    |       | (WordPress.WhiteSpace.ScopeIndent.Incorrect)
--------------------------------------------------------------------------------

一行あるんですね。しかしこれ

                if ( ! empty ( $description ) ) :

のif文の前にある「Tab」２つ文を消すとエラーは収まります。
でもなんでTab入れちゃダメなんだろう、、、う～むという感じです。

トラブルシューティング

Pearの設定間違えた！後からの変更は？

ターミナルアプリから

  1. cd /usr/local/src/pear
  2. sudo php -d detect_unicode=0 go-pear.phar

で設定画面になります。

Pearの設定確認方法は？

ターミナルアプリから

  • pear config-show

とすることで確認できます。

参考情報

2014年5月8日　木谷

関連記事

コメントを残す

以下に詳細を記入するか、アイコンをクリックしてログインしてください。

Gravatar
WordPress.com ロゴ

WordPress.com アカウントを使ってコメントしています。 ( ログアウト /  変更 )

Twitter 画像

Twitter アカウントを使ってコメントしています。 ( ログアウト /  変更 )

Facebook の写真

Facebook アカウントを使ってコメントしています。 ( ログアウト /  変更 )

キャンセル

%s と連携中