S3にTravisCIから自動でアップロードする

travis ciでVue.jsのプロジェクトをビルドしてdist/をS3にアップロードするようにします。

.travis.ymlの設定

.travis.ymlの設定は、travis setup s3コマンドが色々と便利にやってくれます。入れていない方はインストールしましょう。

$ gem install travis
$ travis version
1.8.8
$ travis setup s3                                                                                                        [master]
Detected repository as asmsuechan/asmsuechan.com, is this correct? |yes| yes
Access key ID: xxxxxxxxxxxxxxxxxxxx
Secret access key: ****************************************
Bucket: s3://asmsuechan.com
Local project directory to upload (Optional):
S3 upload directory (Optional): dist
S3 ACL Settings (private, public_read, public_read_write, authenticated_read, bucket_owner_read, bucket_owner_full_control): public_read
Encrypt secret access key? |yes| yes
Push only from asmsuechan/asmsuechan.com? |yes| yes

実際はこのままじゃ動かないので色々追記して以下のようになりました。

# .travis.yml
language: node_js
node_js:
  - 7
install:
- yarn
script:
- yarn run lint
- yarn run build
deploy:
  provider: s3
  skip_cleanup: true
  access_key_id: xxxxxxxxxxxxxxxxxxxx
  secret_access_key:
    secure: xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
  bucket: asmsuechan
  region: ap-northeast-1
  local_dir: dist
  acl: public_read
  on:
    repo: asmsuechan/asmsuechan.com

bucketの値にはs3://を含めていはいけないようです。

やった事

以下の3つのことをしました。

  • nodejsのバージョンを7に指定。
  • regionをap-northeast-1に指定。
  • local_dir: distを追加
  • skip_cleanup: trueを追加

それぞれちょっと詳しく書いていきます。

nodejsのバージョンを7にする

何も指定しないとnodejsのバージョンは0.10.48らしいです。これだとyarnが動かない。

Node.js version v0.10.48 does not meet requirement for yarn. Please use Node.js 4 or later.

regionをap-northeast-1にする

regionを指定しないと以下のエラーが出ます。デフォルトのregionはus-east-1らしいです。

The bucket you are attempting to access must be addressed using the specified endpoint.
Please send all future requests to this endpoint. (AWS::S3::Errors::PermanentRedirect)

skip_cleanup: trueを追加

local_dir: distを追加しても、そのままではデプロイ時にはscriptで生成されたdistディレクトリは消えてしまうようです。

出たエラーをググったらこのIssueコメント に行き着いたのでskip_cleanup: trueを追加しました。

/home/travis/.rvm/gems/ruby-2.2.7/gems/dpl-s3-1.9.8/lib/dpl/provider/s3.rb:56:in `chdir': No such file or directory @ dir_chdir - dist (Errno::ENOENT)

できたもの

私のポートフォリオサイトもどきができました。 http://asmsuechan.com/
-> https化しました。 https://asmsuechan.com

ちょっと注意

  • デプロイ専用のIAMユーザーを作りましょう
  • 403が出る方はポリシーの適用を忘れていませんか?ここなどを参考にしてみましょう

参考

S3 Deployment - Travis CI