【CircleCI 2.0】GitHub Pages へ指定ディレクトリ内だけを push するための config.yml

約2年前に上のような記事を書いたのですが、
いよいよ CircleCI ver.1 も今月をもって廃止ということで、
CircleCI 2.0 向けに書いたものを貼りつけておきます。

f:id:nekonenene:20180821041348p:plain

1. config.yml の設定

以前と同じように、結果から貼りつける形にしようと思います。
このような config.yml を、リポジトリのトップディレクトリに作った .circleci ディレクトリの中に置きます。

なお、このリポジトリで使っているものです。

ソースは src ディレクトリに入っていて、 npm run build:prod で webpack を用いビルドすると、
dist ディレクトリの中に、babel や minify かましたものとか、pug をコンパイルした、HTML, JS ファイル群が入る仕組みになっています。

1-1. dist ディレクトリ以外を削除

- run:
    name: remove files and dirs which exclude `dist`
    command: /bin/ls -A | grep -v -E '^(dist$|.git)' | xargs rm -rf

まず、 dist ディレクトリ、および、 .git ディレクトリ（と、ついでに .gitignore ファイル）以外を削除しています。
そのために用いているのが、以下のコマンドです。

/bin/ls -A | grep -v -E '^(dist$|.git)' | xargs rm -rf

なぜ単純に ls でなく /bin/ls なのかと言えば、 ls 自体が ls -a --color=auto のエイリアスだったりするからです。
今回、 -a オプションは有効にしたくなく、 -A オプションのみ用いたいために、 /bin/ls を利用しています。

-A オプションは、 -a オプションと似ていますが、 . や .. を出力しません。

ls の結果から grep で、 dist という名前、もしくは .git から始まるディレクトリ・ファイル以外を選択します。
-v オプションは「～以外」の意味合い、 -E オプションは正規表現を使う場合に指定します。

最後に xargs コマンドで rm -rf の引数としてディレクトリ・ファイル名を渡し削除がおこなわれています。

1-2. dist ディレクトリをトップディレクトリに

- run:
    name: move `dist` dir to current dir
    command: mv ./dist/* ./

mv コマンドで dist ディレクトリの中身を移動しています。

1-3. gh-pages ブランチにデプロイ

- run:
    name: deploy to gh-pages
    command: |
      git config --global user.name  "CircleCI"
      git config --global user.email "circleci@gh-pages.com"
      git add .
      git commit -m "Publish [ci skip]"
      git checkout -B gh-pages
      git push -u origin gh-pages --force

前回の記事で説明したことですので、説明は省きます。

今回は簡潔に build job ひとつにデプロイまでまとめていますが、
Circle CI 2.0 の Workflows 機能を用いて、 build, test, deploy を別ジョブとして定義すると、より CircleCI 2.0 らしい config.yml になるでしょう。