Phoenix 1.4 のアプリケーションをGigalixirにデプロイしたが、push中の yarn install で弾かれたり、URL開くと503になっていたりとスムーズに行かない部分があったため、対処法を記録として残しておく。
想定環境
- Elixir 1.8.2
- Phoenix Framework 1.4.6
- Node.js 10.16.0 (2019/06/17現在の最新LTS版)
プロジェクト作成と設定
事前にPhoenixプロジェクトの作成や、GigalixirのCLI環境などを準備しておく。Elixir/PhoenixのバージョンをGigalixirとローカルで合わせるため、以下の設定をプロジェクトのルートディレクトリに作成する。
elixir_version=1.8.2
Gigalixirのアプリケーション作成とリモートブランチの設定はgigalixir create -n $APP_NAMEで同時にできる。ドキュメントによればリージョンなどもここで設定できる。
トラブル発生
Vue.jsやStylusなどを設定したり、Phoenixの実装を進めて、いざデプロイ…しようとしたところいろいろ躓いたので以下対処法になる。
問題１．git pushで弾かれる
git push gigalixir masterでデプロイしたが、webpackのインストール中にエラーで弾き返された。以下ログ。
-----> Building dependencies
Installing and caching node modules
yarn install v0.27.5
[1/4] Resolving packages...
[2/4] Fetching packages...
error webpack@4.4.0: The engine "node" is incompatible with this module. Expected version ">=6.11.5".
error Found incompatible module
info Visit https://yarnpkg.com/en/docs/cli/install for documentation about this command.
remote: Command '[u'docker', u'run', u'--memory-reservation=512m', u'--rm', u'-e', u'GIGALIXIR_SHOULD_CLEAN_CACHE=False', u'-v', u'/tmp/tmpRmegRg/inst-playground:/tmp/app', u'-v', u'/tmp/gigalixir/cache/inst-playground/:/tmp/cache', u'-v', u'/tmp/tmpRmegRg/env:/tmp/env', u'--env=USER=www-data', u'us.gcr.io/gigalixir-152404/herokuish:latest']' returned non-zero exit status 1
To https://git.gigalixir.com/your-app-name.git/
! [remote rejected] master -> master (pre-receive hook declined)
error: failed to push some refs to 'https://git.gigalixir.com/your-app-name.git/'
どうやらNode.jsのバージョンが合わないようだ。というわけでバージョンの指定方法を公式ドキュメントから調べたところ、ここによれば、次のような設定ファイルをルートディレクトリに置けば良いようだ。nodejs/npm/yarnのバージョンは適当に調整すること。
# Clean out cache contents from previous deploys
clean_cache=false
# We can change the filename for the compile script with this option
compile="compile"
# We can set the version of Node to use for the app here
node_version=10.16.0
# We can set the version of NPM to use for the app here
npm_version=6.9.0
# We can set the version of Yarn to use for the app here
yarn_version=1.16.0
# We can set the path to phoenix app. E.g. apps/phoenix_app when in umbrella.
phoenix_relative_path=.
# Remove node and node_modules directory to keep slug size down if it is not needed.
remove_node=false
# We can change path that npm dependencies are in relation to phoenix app. E.g. assets for phoenix 1.3 support.
assets_path=.
# We can change phoenix mix namespace tasks. E.g. `phoenix` for phoenix < 1.3 support.
phoenix_ex=phx
問題２．デプロイ先を見たら503でアクセスできない
デプロイはできたが、ページにアクセスしても503ばかり返ってくる。少し待ったりしたが、明らかに動いてないのでgigalixir logs -a $APP_NAMEでログ調査してみた。以下はそのログ。
2019-06-16T06:53:49+00:00 your-app-name[gigalixir]: Readiness probe failed: dial tcp 10.56.8.104:4000: connect: connection refused
2019-06-16T06:58:49+00:00 your-app-name[gigalixir]: Readiness probe failed: dial tcp 10.56.8.104:4000: connect: connection refused
2019-06-16T07:03:49+00:00 your-app-name[gigalixir]: Readiness probe failed: dial tcp 10.56.8.104:4000: connect: connection refused
2019-06-16T07:08:49+00:00 your-app-name[gigalixir]: Readiness probe failed: dial tcp 10.56.8.104:4000: connect: connection refused
2019-06-16T07:13:49+00:00 your-app-name[gigalixir]: Readiness probe failed: dial tcp 10.56.8.104:4000: connect: connection refused
...
アプリサーバーに繋がってない…というわけで、Phoenixアプリケーション側に問題があると見てconfig見てたらprod.exsをまともに設定していなかったことに気付く。以下のように修正した。
use Mix.Config
config :projectname, PROJECTNAME_WEB.Endpoint,
# url: [host: "example.com", port: 80], #<== 削除
http: [port: 4000], #<== 追加
check_origin: ["//your-app-name.gigalixirapp.com"], #<== 追加
cache_static_manifest: "priv/static/cache_manifest.json"
最後に
ここまで来てやっとデプロイできた。Gigalixirはまだ新しいサービスなので、仕様が変わる可能性もある。使うときは一度ドキュメントに目を通したほうが良さそう。
近々、現在開発中のプロジェクトをソースも含めて公開（予定）