https://qiita.com/MoguraStore/items/ca80c99c5542898ec3b5
https://qiita.com/masarashi/items/6b437596c81a2c6347a4
https://github.com/rails/webpacker/blob/5-x-stable/docs/docker.md
Docker開発環境で、少しCSSを修正するだけで、すこしVueファイルを書き換えただけで、そこから
ブラウザに反映されるまで結構遅いので、それを解消していきたい。
そもそもコンパイルとは。。。
人間が分かるソースコードを、コンピュータが分かるバイナリコードに変換すること。
翻訳みたいな感じです。
docker-compose.yml
version: '3'
services:
db:
image: mysql:8.0.21
cap_add:
- SYS_NICE
# コンテナにLinux機能を追加するオプションのようです。SYS_NICEは、プロセスの優先度(nice値)をあげます。
environment:
MYSQL_ROOT_PASSWORD: ${MYSQL_ROOT_PASSWORD}
MYSQL_HOST: db
ports:
- '3306:3306'
volumes:
- mysql-data:/var/lib/mysql
command: --default-authentication-plugin=mysql_native_password # 認証方式を8系以前のものにする
web: &web
build: .
command: ./bin/rails s -b 0
stdin_open: true
tty: true
# この2文を追加でコンテナ内の標準入出力をローカルマシンのターミナルにアタッチする準備が整います。
volumes:
- .:/coffee_passport
ports:
- "3000:3000"
depends_on:
- db
environment:
WEBPACKER_DEV_SERVER_HOST: webpacker
MYSQL_ROOT_PASSWORD: ${MYSQL_ROOT_PASSWORD}
RAILS_MASTER_KEY: ${RAILS_MASTER_KEY}
SENDGRID_API_KEY: ${SENDGRID_API_KEY}
ADMIN_USER_PASSWORD: ${ADMIN_USER_PASSWORD}
AWS_ACCESS_KEY_ID: ${AWS_ACCESS_KEY_ID}
AWS_SECRET_ACCESS_KEY: ${AWS_SECRET_ACCESS_KEY}
GOOGLE_USER_NAME: ${GOOGLE_USER_NAME}
GOOGLE_PASSWORD: ${GOOGLE_PASSWORD}
SENDGRID_USER_NAME: ${SENDGRID_USER_NAME}
SENDGRID_PASSWORD: ${SENDGRID_PASSWORD}
PAYJP_SECRET_KEY: ${PAYJP_SECRET_KEY}
PAYJP_PUBLIC_KEY: ${PAYJP_PUBLIC_KEY}
MYSQL_HOST: db
# selenium_chrome を使うために以下の行を追加
SELENIUM_DRIVER_URL: http://selenium_chrome:4444/wd/hub"
selenium_chrome:
image: selenium/standalone-chrome-debug
logging:
driver: none
webpacker:
<<: *web
command: ./bin/webpack-dev-server
environment:
WEBPACKER_DEV_SERVER_HOST: 0.0.0.0
ports:
- "3035:3035"
volumes:
mysql-data:
driver: local
vendor_bundle:
driver: local
まあこんな感じで。
docker build したら
bundler::GemNotFoundとか言われたので、
docker-compose run web bundle install
をして
もう一回docker-compose buildをして
docker-compose upをした
docker-compose up --buildと実行してもいいかもしれない。
したら立ち上がった！！
おー、なんだかしらんけどめっちゃ早くなった。。。！！！！！
webコンテナでwebpackerを動かしてるからなのかな
web_1 | ↳ app/helpers/sessions_helper.rb:52:in `current_user'
webpacker_1 | ℹ ｢wdm｣: Hash: 0a83921229f4d3830571
webpacker_1 | Version: webpack 4.44.2
webpacker_1 | Time: 351ms
webpacker_1 | Built at: 08/28/2021 6:19:59 AM
webpacker_1 | Asset Size Chunks Chunk Names
webpacker_1 | js/application-624a05864c1609de4951.js 489 KiB application [immutable] application
webpacker_1 | js/application-624a05864c1609de4951.js.map 553 KiB application [dev] application
webpacker_1 | js/components/Home-361b382044fa0e6212c9.js 398 KiB components/Home [immutable] components/Home
webpacker_1 | js/components/Home-361b382044fa0e6212c9.js.map 446 KiB components/Home [dev] components/Home
webpacker_1 | js/components/about_coffee_passport-2b1e5adb925263f552c2.js 402 KiB components/about_coffee_passport [immutable] components/about_coffee_passport
webpacker_1 | js/components/about_coffee_passport-2b1e5adb925263f552c2.js.map 450 KiB components/about_coffee_passport [dev] components/about_coffee_passport
webpacker_1 | js/components/contact-0e386a5175c9bf39f684.js 400 KiB components/contact [immutable] components/contact
webpacker_1 | js/components/contact-0e386a5175c9bf39f684.js.map 448 KiB components/contact [dev] components/contact
webpacker_1 | js/components/drinks/show-f0370d049a91a61a3736.js 405 KiB components/drinks/show [immutable] components/drinks/show
webpacker_1 | js/components/drinks/show-f0370d049a91a61a3736.js.map 453 KiB components/drinks/show [dev] components/drinks/show
webpacker_1 | js/components/footer-57b13b2727143062a5c1.js 399 KiB components/footer [immutable] components/footer
webpacker_1 | js/components/footer-57b13b2727143062a5c1.js.map 446 KiB components/footer [dev] components/footer
webpacker_1 | js/components/like/likeButton-9e5b1dc6936d87ee53ba.js 491 KiB components/like/likeButton [immutable] components/like/likeButton
webpacker_1 | js/components/like/likeButton-9e5b1dc6936d87ee53ba.js.map 538 KiB components/like/likeButton [dev] components/like/likeButton
webpacker_1 | js/components/search-f76bc5973a92117dd7b5.js 395 KiB components/search [immutable] components/search
webpacker_1 | js/components/search-f76bc5973a92117dd7b5.js.map 444 KiB components/search [dev] components/search
webpacker_1 | js/footer-b2b18c8d7b63b0095eee.js 819 KiB footer [immutable] footer
webpacker_1 | js/footer-b2b18c8d7b63b0095eee.js.map 955 KiB footer [dev] footer
webpacker_1 | js/hello_vue-8c7769b281f24ab4052c.js 810 KiB hello_vue [emitted] [immutable] hello_vue
webpacker_1 | js/hello_vue-8c7769b281f24ab4052c.js.map 917 KiB hello_vue [emitted] [dev] hello_vue
webpacker_1 | js/preview-aa96d8501f36b698de20.js 394 KiB preview [immutable] preview
webpacker_1 | js/preview-aa96d8501f36b698de20.js.map 444 KiB preview [dev] preview
webpacker_1 | js/router/router-25609a1739d573aa3112.js 812 KiB router/router [immutable] router/router
webpacker_1 | js/router/router-25609a1739d573aa3112.js.map 952 KiB router/router [dev] router/router
webpacker_1 | js/tag-51f49d776cc13c0cd724.js 397 KiB tag [immutable] tag
webpacker_1 | js/tag-51f49d776cc13c0cd724.js.map 448 KiB tag [dev] tag
webpacker_1 | manifest.json 4.69 KiB [emitted]
webpacker_1 | ℹ ｢wdm｣: Compiled successfully.
webpackerコンテナを用意するまでは、今まではwebpackerをどこで動かしていたのか。。。。
web: &web
<<: *web
とかは、継承してるかんじ。
ただ、 command:
とか、 ports:とか
webコンテナとかぶってるオプション？とかは
上書きされる。といった認識。
間違ってたら指摘していただければ幸いです。