AWS Elastic BeanstalkへRails・Dockerでサービスをデプロイする(Windows)
環境
- Windows 10
EB CLIのインストール(1)
EB CLI は AWS Elastic Beanstalk のコマンドラインインターフェイスで、ローカルリポジトリからの環境の作成、更新、およびモニタリングを簡素化するインタラクティブなコマンドを提供します。
Prerequisitesのインストール
- 手順
- GitHubで入手できるEB CLIセットアップスクリプトを利用
- Prerequisites
- Python入ってないので入れる。
-
Pyenv does not officially support Windows and does not work in Windows outside the Windows Subsystem for Linux. Moreover, even there, the Pythons it installs are not native Windows versions but rather Linux versions running in a virtual machine -- so you won't get Windows-specific functionality.
If you're in Windows, we recommend using @kirankotari's pyenv-win fork -- which does install native Windows Python versions.- Pyenvいれるの面倒くさそう...
- 普通にPythonのダウンロードページからいれる。
- Pathにチェックを入れる!(理由を「Pythonのバージョンが出てこない」にまとめた)
-
- virtualenvも入っていないので入れる
- pipは既に入っている
- https://www.python.jp/install/windows/virtualenv.html
py -m pip install virtualenv
- 入った!!
- Python入ってないので入れる。
$ virtualenv --version
virtualenv 20.16.6 from C:\Users\NAME\AppData\Local\Programs\Python\Python311\Lib\site-packages\virtualenv\__init__.py
Pythonのバージョンが出てこない
$ python --version
Python
- https://happy-tenshoku.com/post-6679/
- パスにチェックをつけ忘れてた?
- bash再起動したらOK
$ python --version
Python 3.11.0
EB CLIのインストール(2)
- 2.1: git clone
git clone https://github.com/aws/aws-elastic-beanstalk-cli-setup.git
- 2.2 install/Upgrade the EB CLI
python ./aws-elastic-beanstalk-cli-setup/scripts/ebcli_installer.py
→ 出力
***********************************
1. Locating virtualenv installation
***********************************
******************************************
2. Creating exclusive virtualenv for EBCLI
******************************************
************************
3. Activating virtualenv
************************
*******************
4. Installing EBCLI
*******************
***********************
5. Creating EB wrappers
***********************
***************
6. Finishing up
***************
Success!
To complete installation, ensure `eb` is in PATH. You can ensure this by executing:
1. CMD Prompt:
cmd.exe /c "C:\Users\NAME\.ebcli-virtual-env\executables\path_exporter.bat"
2. PowerShell:
& "C:\Users\NAME\.ebcli-virtual-env\executables\path_exporter.vbs"
NOTE: Additionally, you would need to **restart this shell**
ユーザー名に半角が入っているせいでエラーに苦しむ
cmd.exe /c "C:\Users\NAME\.ebcli-virtual-env\executables\path_exporter.bat"
これがどうしてもできない!
おそらく、自分のユーザー名に半角を含むため。
- パスをショートパスで置き換えても、一回コマンドは通るのだかが、結局そのあとバッチが回るところで同じエラーが発生する
- このバッチファイルを回すのでは埒が明かなそうなので、別のやり方を検討する。
別の方法を検討
- Windows で Python、pip、EB CLI をインストールする
- 記事の手順の通り以下を実行
- pythonのインストール(3.7系のインストールexeから)
-
pip --version
もクリア -
pip install awsebcli --upgrade --user
を実行
- PATHの変更
-
%USERPROFILE%\AppData\roaming\Python\Python37\scripts
を追加 - PATHの追加はこれとか参考になるかも
-
- 入った!!!!歓喜!!!
$ eb --version
EB CLI 3.20.3 (Python 3.7.9)
ちゃんと調べてないが
- 最初はPython3.11でやっていたが、
%USERPROFILE%\AppData\roaming\Python
ディレクトリができていなかった。この辺りバージョンのずれで色々面倒くさそうだと思ったので、いったんAWSのドキュメントの通り3.7でやり直し。 - 自分はPythonは明るくないが(大学の研究でちょっと使ったくらい)、3.7ってやたら聞くわりに実は3.11まで出てたのか。3.7って特別な存在感あるバージョンなの?
ECSプラットフォームでのデプロイ
ソースコード変更
- docker-compose.prod.yml
- Dockerrun.aws.json
- containers/nginx/Dockerfile(nginx用のDockerfile)
- containers/nginx/nginx.conf
本番用のコンテナを立てる
- 本番用docker-compose
$ docker-compose -f docker-compose.prod.yml build
- 立った
$ docker images
REPOSITORY TAG IMAGE ID CREATED SIZE
memoria-prod-server latest b393a8aad5f0 8 seconds ago 133MB
memoria-prod-web latest 0aa651810887 14 seconds ago 1.68GB
memoriaweb-web latest 2f92b4943737 24 hours ago 1.68GB // これは開発環境用
mysql 8.0.28 f2ad9f23df82 6 months ago 521MB
ECRへのプッシュ
- 順番的に正しいかは分からないが、ローカルでdocker imageがビルドされたのでECRに上げていく。
- まずはECRでリポジトリの作成。今回でいうと、memoria-prod-webとmemoria-prod-serverの2つを作成
- pushコマンドにならってpushしていく
- 1つ目のコマンドがまず通らない。awsコマンドが見つからないとのこと
$ aws ecr get-login-password --region ap-northeast-x | docker login --username AWS --password-stdin xxxxxxxx.dkr.ecr.ap-northeast-x.amazonaws.com
bash: aws: command not found
Error: Cannot perform an interactive login from a non TTY device
AWS CLIのインストール
- 参考: 公式doc
- Windows 用の AWS CLI MSI インストーラ (64 ビット) をダウンロードして実行(公式ドキュメントの通り)
- 入った
$ aws --version
aws-cli/2.8.10 Python/3.9.11 Windows/10 exe/AMD64 prompt/off
ECRへのPush(続き)
- AWS CLIが入ったので再開
$ aws ecr get-login-password --region ap-northeast-x | docker login --username AWS --password-stdin xxxxxxxx.dkr.ecr.ap-northeast-x.amazonaws.com
Unable to locate credentials. You can configure credentials by running "aws configure".
Error: Cannot perform an interactive login from a non TTY device
-
参考記事
- 自分の環境でやってみると? => 何も設定されていない。
$ aws configure list
Name Value Type Location
---- ----- ---- --------
profile <not set> None None
access_key <not set> None None
secret_key <not set> None None
region <not set> None None
- 設定する
- 公式doc: AWS CLIの設定について
- 新しいIAMユーザーを作成(AWS認証情報タイプはアクセスキー)
- AmazonEC2ContainerRegistryFullAccessとIAMUserChangePasswordをアタッチ
- アクセスキー・シークレットアクセスキーを作成
-
aws configure
にて設定
- 再度ログインを試みる。
$ aws ecr get-login-password --region ap-northeast-x | docker login --username AWS --password-stdin xxxxxxxx.dkr.ecr.ap-northeast-x.amazonaws.com
Login Succeeded
- ECRのpushコマンドに習って続き
- ステップ2のビルドは既に済んでいるのでスキップ
- イメージにタグをつける
$ docker tag memoria-prod-web:latest xxxxxxxxxx.dkr.ecr.ap-northeast-x.amazonaws.com/memoria-prod-web:latest
- 4のpushコマンド
$ docker push xxxxxxx.dkr.ecr.ap-northeast-x.amazonaws.com/memoria-prod-web:latest
できた!
- Webの方だけじゃなくてserverの方もやっておく(nginxの方)
Elastic Beanstalkに環境作成
GUIで作る
- 環境枠の選択: ウェブサーバー環境
- プラットフォーム
- Docker
- ECS running on 64bit Amazon Linux 2
- 3.2.1 (Recommended)
- アプリケーションのソースバンドルを作成してアップロード
- assets: clobberとprecompileをする(必要かは分からないが)
- 環境の作成 => 黒いログ画面が出力されつつ、数分間待機
- 動かない
- フルログを出力
- マウントするvolumeのファイル名が間違っていたので修正
- 再デプロイ → エラー
- メモリ不足とのこと。インスタンスタイプがt2.microだから説がある。 t3.mediumにあげる → t3.mediumでもだめだったのでt3.largeにする
Nov 10 10:05:54 ip-xxxxxxxxxx eb-ecs: + error_exit 'Encountered error starting new ECS task: {
Nov 10 10:05:54 ip-xxxxxxxxxx eb-ecs: "failures": [
Nov 10 10:05:54 ip-xxxxxxxxxx eb-ecs: {
Nov 10 10:05:54 ip-xxxxxxxxxx eb-ecs: "reason": "RESOURCE:MEMORY",
Nov 10 10:05:54 ip-xxxxxxxxxx eb-ecs: "arn": "arn:aws:ecs:ap-northeast-x:xxxxxx:container-instance/xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx"
- いろいろと詰まってたのだが、docker-compose.prod.ymlに記載するパス名がDockerfileと会っていなかったことに気づく。
- 治してデプロイしたら、今までは「動作していません」になっていたところが、「502 Bad Gateway」になった。
- 別の話だが、Task失敗、REASON: MEMORYは、こちら(Dockerrun.aws.json)で指定しているメモリの量に対して、CPUのメモリが確保できないときに発生する模様
ひたすら格闘
- アプリケーションの方のコンテナが立ち上がらない
- EC2インスタンスの中に入りコンテナの状況を確認すると、コンテナが終了している
$ sudo docker ps
CONTAINER ID IMAGE COMMAND CREATED STATUS PORTS NAMES
e59f6af221b1 amazon/amazon-ecs-agent:latest "/agent" 16 minutes ago Up 16 minutes (healthy) ecs-agent
-
docker ps -a
をすると、大量のExited(127)のコンテナの残骸がある - コンテナのログを確認する
$ sudo docker logs c134
bash: line 1: rm -f tmp/pids/server.pid && bundle exec rails s -p 3000 -b '0.0.0.0': No such file or directory
- Dockerrun.aws.jsonの書き方が問題?
- docker-compose.ymlと同じコマンドを書いてみる
"command": ["bash", "-c", "\"rm -f tmp/pids/server.pid && bundle exec rails s -p 3000 -b '0.0.0.0'\""],
[ec2-user@ip-xxx ~]$ sudo docker logs 768
bash: line 1: rm -f tmp/pids/server.pid && bundle exec rails s -p 3000 -b '0.0.0.0': No such file or directory
- pidの方をコマンドから消してみる
"command": ["bash", "-c", "\"bundle exec rails s -p 3000 -b '0.0.0.0'\""],
[ec2-user@ip-xxxx ~]$ sudo docker logs 4e5
bash: line 1: bundle exec rails s -p 3000 -b '0.0.0.0': command not found
この書き方って、bundle exec rails ...をひとまとまりのコマンドだととらえられている感じだな
$ aaaaaa bbb
bash: aaaaaa: command not found
フォルダ構造変える
- Dockerfileを書き換え、アプリケーションのルートの位置を変えたらコンテナがすぐ死ななくなった。
- もともとは/var/wwwがなく、/MemoriaWebだった
FROM ruby:3.1
RUN mkdir -p /var/www/MemoriaWeb
WORKDIR /var/www/MemoriaWeb
コンテナは死ななくなった
- がしかし、ずっとロードしている
- AWSに問い合わせた結果、
curl -v <上記環境の URL> の結果
を打つように指示される
curl(カール)とは「client for URL」の略で、主にUNIX系OS(MacやLinux)で使用できるコマンドで、URL(http、httpsなどで始まる通信)で表現される通信をコマンドプロンプト でコマンド実行し、データを取得することができます。
普段、何気なくブラウザを利用してURLを打ち込んで画面を表示していますが、curlを利用するとhttp通信のリクエスト、レスポンスの詳細を指定、参照することができます。
またhttpを使用したAPI通信の疎通確認などにもよく使用されます。
結果の抜粋
< HTTP/1.1 301 Moved Permanently
< Server: nginx/1.18.0
方針のアドバイス
お客様の環境のロードバランサー(awseb-AWSEB-XXXXXXX)の設定を確認したところ、HTTPS リスナー(参考資料 [1])が設定されていないものと見受けられます。
この場合、HTTPS のリクエストはターゲット(i-xxxxxxxxxxxxxxx)にルーティングされません。(参考資料 [2])
以上より、当該 URL へのアクセスがタイムアウトする原因としまして、Nginx が HTTPS へリダイレクトするものの、ロードバランサー(awseb-AWSEB-xxxxxxxxxx)が HTTPS リスナーを持っていないためにターゲット(i-xxxxxxxxxxxxxx)と通信ができていないことが考えられます。
上記の場合、ロードバランサー(awseb-AWSEB-xxxxxxxxxxxxx)に HTTPS リスナーを追加していただくことで、ターゲット(i-xxxxxxxxxxxxx)との通信が可能となり、タイムアウトする事象が解決するものと考えられます。
Elastic Beanstalk で HTTPS を使用するには、環境内でロードバランサー用の HTTPS リスナーを設定する必要がございます。
必要な HTTPS リスナー、セキュリティグループの設定方法につきましては、参考資料 [3] をご確認くださいませ。
■その他ご確認いただきたい内容
上記の調査結果をもとに、「HTTPS へリダイレクトする」ことがお客様の期待値通りの動作かご確認いただけますでしょうか。
上記「HTTPS へリダイレクトする」ことを期待されない場合には、お手数をおかけいたしますが、お客様にて Nginx の設定をご確認いただき、リダイレクトされないよう変更していただければと存じます。
ご参考とはなりますが、Elastic Beanstalk を使用しての HTTPS へのリダイレクトに関する設定内容につきましては、参考資料 [4] がご参考になる可能性がございますので、よろしければご確認くださいませ。
合わせて送られてきた参考資料
■参考資料
[1]Application Load Balancer 用の HTTPS リスナー
[2]Application Load Balancer のリスナー
— [2] の抜粋 —
リスナーに対して定義したルールにより、ロードバランサーが登録済みターゲットにリクエストをルーティングする方法が決まります。
———————
[3]Elastic Beanstalk 環境で HTTPS を使用する
— [3] の抜粋 —
AWS Elastic Beanstalk 環境を更新して HTTPS を使用するには、環境内でロードバランサー用の HTTPS リスナーを設定する必要があります。
———————
[4]HTTP から HTTPS へのリダイレクトの設定
HTTPSをリスナーにいれる
- HTTPSリスナーを設定するためには、SSL証明書を選択しなければならない
- まずその証明書を用意しなければならない
- AWS Certificate ManagerでSSL証明書を作成
- DNSに指定されたCNAMEを追加して更新
- => ちょっと待って完了
- デプロイできた!!
- CSS等があたっていない
- assets:precompileをしてないからか?
- してデプロイしたが変わらなかった。
データベースの構築
- RDSでデータベースを作成する
エラーがでてアクセスできない
ActiveRecord::ConnectionNotEstablished (Can't connect to local MySQL server through socket '/run/mysqld/mysqld.sock' (2)):
- database,ymlを更新していないから
- https://qiita.com/setsumaru1992/items/6ed0173eba3ff8aa138a
production:
<<: *default
database: <%= ENV['RDS_DB_NAME'] %>
username: <%= ENV['RDS_USERNAME'] %>
password: <%= ENV['RDS_PASSWORD'] %>
host: <%= ENV['RDS_HOSTNAME'] %>
port: <%= ENV['RDS_PORT'] %>
また別のエラー
ActiveRecord::StatementInvalid (Mysql2::Error: Table 'ebdb.users' doesn't exist):
- これもDBを作ってないので当たり前
RDSのデータベースを覗く
- DATABASE自体はできている
- TABLEができていない => migrationの必要性がありそう
MySQL [ebdb]> SELECT DATABASE();
+------------+
| DATABASE() |
+------------+
| ebdb |
+------------+
1 row in set (0.000 sec)
MySQL [ebdb]> SHOW TABLES;
Empty set (0.001 sec)
- migrateを実行 => 500エラー消えた
アプリケーションコードエラー
- もはやこれはインフラではなくアプリケーションのレイヤーだが一応書く
- ユーザー登録時にメールアドレスの確認を行うためのメールを出すが、そこが上手くいっていない(500エラー)
ActionView::Template::Error (Missing host to link to! Please provide the :host parameter, set default_url_options[:host], or set :only_path to true):
config.action_mailer.default_url_options = { host: 'https://xxxxxxxx.com' }
config.action_mailer.delivery_method = :smtp
config.action_mailer.smtp_settings = {
enable_starttls_auto: true,
address: "smtp.gmail.com",
domain: "smtp.gmail.com",
port: 587,
authentication: "login",
user_name: ENV['GMAIL_USER_NAME'],
password: ENV['GMAIL_PASSWORD']
}
CSSが当たっていない問題の解決
- https://qiita.com/yuiko_akiyoshi/items/263fc49414fb3c7a0162
- この記事通りやったら、微妙にあたった
独自で書いたcssが当たっていないっぽい
- 今の本番環境の画像
- 開発環境の画像
- 例えば.footerクラスには、開発環境では以下のように3つのcssが当たっているが、本番環境では何もあたっていない
footer {
background: #303339;
padding-top: 80px;
padding-bottom: 100px;
}
- 関連するかわからないが、本番環境ではconsoleに以下のエラーがでていた
Failed to load resource: the server responded with a status of 404 ()
Failed to load resource: the server responded with a status of 404 ()
- これがcssと関係しているかわからないが、Rails7で新しく導入されたimportmapという概念の模様
// Configure your import map in config/importmap.rb. Read more: https://github.com/rails/importmap-rails
// import "@hotwired/turbo-rails"
import "controllers"
import "./popper"
import "./bootstrap"
ローカルでもcss当たらなくなったぞ?
- ローカル環境のdocker imageをビルドしなおした結果、cssが当たらなくなった。
- production.rbのこの変更くらいだよな...
- 一応直して再ビルドしてみる
- もとに戻らない
- assets:precompileを一度したら、ローカル環境では治った
- ローカルなのに、public/assets下のprecompileされたアセットを使っている。
- https://qiita.com/scivola/items/e3e766b3e672a39b7a8f
ローカルのcssの変更を即座に変更してくれるときとしてくれない時がある
- 変更してくれる時は、変更後にロードがやや長くなって変更される。
- 今回のデプロイ変更をする前のブランチで
docker-compose build
したとき。 - 今回のブランチに切り替えても、同じimageを使う限り、すぐにcssは反映された
- 今回のデプロイ変更をする前のブランチで
- デプロイのための変更によって、修正した何かによって、docker imageの性質が変わっている。
- Dockerfileの、ディレクトリの位置変更(ディレクトリ直下ではなく、/var/wwwの下)
- => これだけ変更したとき、cssはすぐ反映されなかった。これのせいかも
- docker-compose.ymlの、volumesをマウントするパスのせいかも!ここ/var/wwwにしたのに合わせて変更してないや
volumes:
- .:/MemoriaWeb
修正後↓
- .:/var/www/MemoriaWeb
- 治った!!!!!!!
- とりあえず、ローカルでcssが当たらなくなる問題は解消された。あとは本番での問題のみ
- ローカル環境でも、
public/assets
が存在しているとそちらに固定されてしまう。開発するときは削除する必要があるのか。 - なお、docker-compose.ymlの起動コマンドは、コメントアウトされている方でもされていない方でもよい
version: "3.9"
services:
web:
build: .
# command: bash -c "rm -f tmp/pids/server.pid && bundle exec rails s -p 3000 -b '0.0.0.0'"
command: bundle exec puma -C config/puma.rb
引き続きcss当たらない問題
- 本番環境で、
rails assets:precompile
をしたところ、cssが全く当たらなくなって画面がかなり崩れた。
- 新しくcssをアップロードしても、同期されていないのでは?という仮説
できた!
- ローカルで普通にassets:precompileをしてデプロイしたら表示されてしまった。
- 以下の3つのcssは全て同じファイル名(application-xxxxxx.css)を指していた
- ローカルのpublic/assets下のcssファイル名
- 本番のURLでブラウザの検証モードで確認する、読み込まれているcssが記載されているファイル名
- 本番のEC2インスタンスのdocker container内の、public/assets下のcssファイル名
ローカル環境の挙動を色々とチェック
- コンテナが動いている状態: ローカル環境で、publin/assetsフォルダを削除
- 【チェック】ローカルでcssは随時更新されるか?=> 【チェック結果】一度コンテナをkillし、再度docker-compose upをしたとき、都度反映されるようになった(この時点ではまだpublic/assets配下にコンパイルされたファイル群は無し)
- コンテナが動いた状態で、再度ローカルで
assets:precompile
- 【チェック】この時点でもローカルのcss変更はすぐ反映される? => 【チェック結果】すぐ反映された。一度コンテナが作成されたあとは、その後でprecompileをしてpublic以下に作成したとしても同期されない模様。
- 一度ctrl cでプロセスをストップ。再度docker-compose up(コンテナのIDは変わらない)
- 【チェック】css変更はすぐ反映されるか? => 【チェック結果】すぐ反映されなかった。コンテナが立ち上がるタイミングでpublic/assetsが存在していると、その後立ち上げたときにそちらが参照される模様。
- コンテナが立ち上がっている状態で、public/assetsを削除する
- 【チェック】css変更はすぐ反映されるか? => 【チェック結果】すぐ反映されない。立ち上がったコンテナから消してもだめ。ただし、コンテナの中を覗きに行くと、public/assetsディレクトリは消えている。
- コンテナをストップして再度立ち上げる
- 【チェック】css変更はすぐ反映されるか? => 【チェック結果】反映される。コンテナが立ち上がるタイミングでpublic/assetsは存在していなかったから。
本番環境へのデプロイの挙動
- コンテナが動いた状態で、assets:precompileを実行
- ちなみにさっきも確認したが、この時点ではローカルのcssはすぐ反映される。コンテナ立ち上げ時点でpublic/assetsが存在していなかったから。
- 新しいpublic/assets下のファイル群とともにzipを作成しデプロイ
- 【チェック】本番環境で正しくcssが表示されるか確認
- 【チェック結果】先ほどの紺色から、ちゃんと青に変わってる!意図通り
- 【チェック】上記の通り3つのcssファイル名が同じになるか確認
- 【チェック結果】ローカルのコンパイルされたファイル名、本番のブラウザが読み込むファイル名、本番環境のEC2内のコンテナ内のファイル名が3つとも一致していた。OK!
assets:precompile周りで気を付けなければならないこと
- 開発環境のコンテナ立ち上げ時点で、public/assetsフォルダは削除しておく
- そうでない場合、開発環境でcss変更がすぐ反映されない
- 本番環境にpushする直前に、assets:precompileを行い、public/assets下を含めてソースバンドルを作成しデプロイする
- デプロイの後、基本的にはassets:clobberをしておく。
- assets:precompileをした時点から一度もコンテナを削除しなければpublic/assetsフォルダがあっても問題ない。
- だが、何かのタイミングでコンテナを立ち上げるときがある(PC再起動など)。その際、public/assetsがある状態でコンテナを立ち上げると、その後cssがすぐ反映されなくなってしまう。
- 「コンテナを立ち上げるときには、public/assetsフォルダが削除されていること」を意識する
本番環境のcss反映されない問題が原因が分からず解決してしまったので調査
- なぜ本番でcssが表示されるようになったのか、docker-compose.ymlのvolumeのパスの変更かと思われるのでその確認
実験手順
- public/assetsを削除
- docker-compose.ymlの記述を、ローカルでのcss反映がなされなかったときの状態に戻す
# volumes:
# - .:/var/www/MemoriaWeb(正しい方)
volumes:
- .:/MemoriaWeb(昔の間違ってる方。今回はこれでうまくいかないかどうかを検証したい)
- docker-compose upを行う
- 【チェック】cssはすぐ反映されるか =>【チェック結果】すぐ反映されない。これは先ほどの調査の通り。volumeが上手く機能していないことによって、手元の変更がコンテナへ伝えられていない
- フッターの色が紺色ではなく、赤色になるようにcssを変更(当然その変更はローカルには反映されない)
-
docker-compose exec web rails assets:clobber(一応) & precompile
- ここでpublic/assetsフォルダができなくなった。なぜだ?!
- ソースバンドルを作成し、デプロイ
- 500エラーがでてしまう...なんだこれは??
- ログを見たところ、application.cssがないことが原因。これは分かる。なぜならprecompile時点でできていなかったから。それができてない理由が分からないが..(ローカルの問題)
Completed 500 Internal Server Error in 2ms (Allocations: 612)
[325ec288-c945-49bd-920b-e919ce2ba313] ActionView::Template::Error (The asset "application.css" is not present in the asset pipeline.
):
[325ec288-c945-49bd-920b-e919ce2ba313] 11: <link href="https://use.fontawesome.com/releases/v5.6.1/css/all.css" rel="stylesheet">
[325ec288-c945-49bd-920b-e919ce2ba313] 12: <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
[325ec288-c945-49bd-920b-e919ce2ba313] 13:
[325ec288-c945-49bd-920b-e919ce2ba313] 14: <%= stylesheet_link_tag "application", "data-turbo-track": "reload" %>
[325ec288-c945-49bd-920b-e919ce2ba313] 15: <%= javascript_importmap_tags %>
[325ec288-c945-49bd-920b-e919ce2ba313] 16: </head>
[325ec288-c945-49bd-920b-e919ce2ba313] 17:
[325ec288-c945-49bd-920b-e919ce2ba313]
[325ec288-c945-49bd-920b-e919ce2ba313] app/views/layouts/application.html.erb:14
実験は失敗
- とりあえずymlのvolumeを元に戻したら問題なくcssは表示された
- なぜ、volumeの書き方を変えたら今回はpublic/assets配下に何もファイルが作成されなかったのかということに関して、分かっていない。が、これ以上追う時間を取れなそうなので、いったんスルーする。
残すTODO
- jsのインポートでエラーが発生している
- eb deployコマンドでデプロイしたイ
- DNSを設定して、きれいなURLで表示する
jsのインポートエラーの解消
- https://eagerworks.com/blog/import-maps-in-rails-7
- こちらの記事を参考に2つのパスを変更した
// Configure your import map in config/importmap.rb. Read more: https://github.com/rails/importmap-rails
// import "@hotwired/turbo-rails"
import "controllers"
// 変更前
import "./popper"
import "./bootstrap"
// 変更後
import "popper"
import "bootstrap"
別のエラーに切り替わった。このエラーはローカルでも出ていたので、改悪として変更を戻す。
Uncaught TypeError: Failed to resolve module specifier "popper". Relative references must start with either "/", "./", or "../".
ローカル環境と本番
- ローカル環境と本番環境で、読み込まれるjsのファイル数が異なっている
- これはrailsの方で、読み込みの容量を減らすためによしなにやってくれている模様