Travis CI で WordPress テーマをビルドして GitHub にリリースする方法

この記事は Snow Monkey アドベントカレンダー 2018 5日目の記事です。

Snow Monkey は Travis CI という Web サービスを通してビルド、リリース用の zip ファイルをつくり、GitHub に自動デプロイしています。

Snow Monkey は1年で約170回程度のアップデート(リリース)を行ってきましたが、もしこのリリース作業を自動化しておらず毎回手動で行わなければいけなかったとしたら、こんなに何度もアップデートできていなかったはずです。

個人の場合はスピードが重要なので、このような付加価値のない面倒な作業は自動化してしまいましょう。ということで、どうやって Travis CI で自動リリースするのかを書いてみたいと思います。

Travis CI とは

Travis CI はどういうサービスかや、Travis CI を回すための設定ファイルの概要などは以前書いていますのでそちらをご参照ください。

今回はリリース部分に絞って書きたいと思います。

GitHub にリポジトリをつくる

まず GitHub にプロダクトのリポジトリをつくりましょう。

Travis CI をみてみる

Travis CI はこれまでオープンソース向けの .org と、事業向けの .com がありましたが、今後 .com に統合されていくそうです。ということで travis-ci.com を開いてみて、GitHub と連携できているかみてみましょう。

GitHub で「travis-ci-test」というリポジトリをつくってみた例。表示されていれば特に問題ありません。表示されていなければ左側の「Sync account」をクリックしてみてください。

設定ファイル .travis.yml をつくる

先につくったリポジトリをクローンして、そのディレクトリに .travis.yml という名前でからファイルをつくってみてください。細かくは省略しますが、今回はとりあえず下記のような感じで良いかなと。`

sudo: false
language: php
notifications:
  email:
    on_success: never
    on_failure: change
branches:
  only:
  - master
  - develop
  - "/\\d+\\.\\d+\\.\\d+?.*/"
php:
- 5.6
- 7.1

GitHub Releases へのリリース用のコードを追加する

さて、ここからが本番です。GitHub Releases へリリースするためのコードを追加していきます。GitHub と Travis CI を連携させるためには GitHub にトークンをつくったりしないといけないのですが、その辺も含め下記のコードで自動的にやってくれます。

上書きしますか?とか、GitHub と連携させるためにユーザー名やパスワードを聞かれるので指示に従って入力してください。「File to Upload」のところは後で書き換えるので、適当に入れておいてください。

# travis コマンドのインストール(既にインストールされている場合は不要)
$ gem install travis

# GitHub Releases 用の記述を生成して .travis.yml を上書き
$ travis setup releases --com


Detected repository as inc2734/travis-ci-test, is this correct? |yes| yes
Username: inc2734
Password for inc2734:
File to Upload: test.zip
Deploy only from inc2734/travis-ci-test? |yes| yes

ここまですすめると、.travis.yml に次のような記述が追加されているはずです。

deploy:
  provider: releases
  api_key:
    secure: xxxxxxxxxx
  file: test.zip
  on:
    repo: inc2734/travis-ci-test

リリース用の zip ファイルをつくる

Travis CI は勝手にはリリース用の zip ファイルをつくってくれないので、zip を生成するためのコードを書いて、そのコードを Travis CI で実行させることでリリース用の zip ファイルをつくってくれるようになります。

Snow Monkey の場合はもともと Gulp で zip をつくっていたのですが、Gulp が面倒くさくなってきたので今は NPM Scripts でやっています。

下記に NPM Scripts のサンプルを。プロダクトのディレクトリに package.json というファイル名でファイルをつくって記述してください。例によって Windows では動かないかもしれません。

{
  "devDependencies": {
    "rimraf": "^2.6.2"
  },
  ... 省略 ...
  "scripts": {
    "cleanup:zip": "rimraf snow-monkey.zip",
    "zip:pack": "composer install --no-dev && rsync -a --exclude='.*' resources/ snow-monkey",
    "zip:archive": "zip -9 -qmr snow-monkey.zip snow-monkey",
    "zip": "npm run cleanup:zip && npm run zip:pack && npm run zip:archive"
  }
}

Snow Monkey の開発用のディレクトリには、実際のリリースには不必要な設定ファイルや隠しファイルが色々含まれているので、リリース用のファイルをまとめるために snow-monkey というディレクトリをつくり、そこにリリース用のファイルをがーっとコピーして、snow-monkey.zip に固める、という処理をしています。

cleanup:zip

cleanup:zip は snow-monkey.zip を削除する処理です。

zip:pack

zip:pack は開発用のファイルを省いて composer install し、.* で始まるファイルを除いた resources/ ディレクトリ内のファイルを zip 生成用の snow-monkey ディレクトリに放り込むという処理です。

Snow Monkey は開発時とリリース用でディレクトリ構成が違っていて、開発時は各テンプレートファイルを resources というディレクトリに一段落としているのでこのような記述になりますが、普通の構成であれば resources じゃなくて . になります。

--exclude は複数記述ができます。例えばこんなのとか。

rsync -a --exclude='/vendor' --exclude='/node_modules' --exclude='.*' --exclude='*.ruleset.xml' --exclude='*.config.js' --exclude='*.xml.dist' --exclude='/bin' --exclude='/tests' --exclude='package*.json' . snow-monkey && cd snow-monkey && composer install --no-dev

zip:archive

zip:archive は zip:pack でつくったリリース用のディレクトリ snow-monkey を snow-monkey.zip に固める処理です。

zip

zip は上記の各コマンドを順番に実行していく処理になります。

NPM Scripts でつくった zip をリリースに使うように .travis.yml を修正

先に作った .travis.yml の deploy セクションの上に、次の記述を追加してください。

before_deploy:
- npm run build
- npm run zip
- export RELEASE_FILE=$(ls snow-monkey.zip)
deploy:
  ... 省略 ...

before_deploy セクション

before_deploy セクションでは、デプロイ処理の直前に Travis CI で実行させたい処理を指定できます。

npm run deploy でテーマをビルド、npm run zip で zip ファイルを生成、そして、生成した zip ファイルのファイル名である snow-monkey.zip を RELEASE_FILE という変数に格納しています。

deploy セクション

続いて、deploy セクションも下記のように書き換えてください。

deploy:
  provider: releases
  api_key:
    secure: xxxxxxxxxx
  file: "${RELEASE_FILE}"
  skip_cleanup: true
  on:
    tags: true
    php: 7.1
    repo: inc2734/travis-ci-test

skip_cleanup

まず、skip_cleanup: true を追加しました。これは before_deploy セクションで生成した zip ファイルを消さないために必要です。記述を追加しないとつくったファイルがきれいに消された後で deploy セクションが実行されてしまいます。

file

次に、file: "${RELEASE_FILE}" として、before_deploy セクションでつくった zip のファイル名を渡すようにしました。別に普通に snow-monkey.zip って書けばよくね?と思う方もいらっしゃると思いますが(僕もそう思いますが)、なぜかそれでは上手くいかないことがあったのでこのようにしています。

on

最後に、on でデプロイ処理をいつ実行するかを追加しました。上記の例だとタグ付けコミット(git push origin --tags)したときで、かつ、PHP が 7.1 の場合、になります。

一番最初に .travis.yml をつくったときに、

php:
- 5.6
- 7.1

のように記述していますが、これは PHP 5.6 の環境と PHP 7 の環境の2つで Travis CI を回す、という意味になります(今回はビルドとリリースの処理しか書いていないので2環境回す必要はないのですが、例えば PHP 5.6 でも PHP7 でも動作保証する必要がある場合はこの2環境でテストを回す、みたいなことをします)。

on で php バージョンを指定しないと 5.6 と 7 のときと2度デプロイ処理が動いてしまうので、バージョンを指定して 7.1 のときだけデプロイ処理が実行されるようにしています。

そして、リリースはタグ付けと連動するもので、タグ付け以外のコミットでデプロイしてもしょうがないので、tags: true としてタグ付けコミットのときだけデプロイ処理が実行されるようにしています。

プッシュしてみよう

あとは適当なところまでプロダクトをつくって GitHub にプッシュすると Travis CI で処理が実行されます。

Snow Monkey アドベントカレンダーにご参加ください!

参加しても良いよーという方がいましたらぜひご参加くださいませ。ユーザーさんの声や、他業者さんからみた Snow Monkey などめっちゃ聞きたいので、よろしければぜひ!

この記事を書いた人

アバター画像

キタジマ タカシ

長崎県長崎市在住。地元のWeb制作会社でWebデザイナー/エンジニアとして従事した後、2015年にフリーランス [ モンキーレンチ ] として独立。WordPress のテーマやプラグイン、ライブラリ、CSS フレームワーク等、多数のプロダクトをオープンソースで開発・公開しています。

Snow Monkey オンラインコミュニティ

Snow Monkey をより良いテーマにするために、今後の機能開発等について情報共有したりディスカッションをしたりする場所です。より多くのユーザーの交流があったほうがより良いプロダクトに育っていくと思いますので、ぜひご参加ください!