Docker上のyarnの依存関係を解決。




docker-compose upで

```
RUN yarn upgrade

```

の部分でエラーがでた。

```
Step 13/19 : RUN yarn upgrade
 ---> Running in 3c8f3922483b
yarn upgrade v1.22.17
warning package-lock.json found. Your project contains lock files generated by tools other than Yarn. It is advised not to mix package managers in order to avoid resolution inconsistencies caused by unsynchronized lock files. To clear this warning, remove package-lock.json.
[1/4] Resolving packages...
info There appears to be trouble with your network connection. Retrying...
warning @rails/webpacker > webpack > watchpack > watchpack-chokidar2 > chokidar@2.1.8: Chokidar 2 will break on node v14+. Upgrade to chokidar 3 with 15x less dependencies.
warning @rails/webpacker > webpack > watchpack > watchpack-chokidar2 > chokidar > fsevents@1.2.13: fsevents 1 will break on node v14+ and could be using insecure binaries. Upgrade to fsevents 2.
warning @rails/webpacker > postcss-preset-env > postcss-color-functional-notation > postcss-values-parser > flatten@1.0.3: flatten is deprecated in favor of utility frameworks such as lodash.
warning @rails/webpacker > webpack > node-libs-browser > url > querystring@0.2.0: The querystring API is considered Legacy. new code should use the URLSearchParams API instead.
warning @rails/webpacker > optimize-css-assets-webpack-plugin > cssnano > cssnano-preset-default > postcss-svgo > svgo@1.3.2: This SVGO version is no longer supported. Upgrade to v2.x.x.
warning @rails/webpacker > webpack > micromatch > snapdragon > source-map-resolve > resolve-url@0.2.1: https://github.com/lydell/resolve-url#deprecated
warning @rails/webpacker > webpack > micromatch > snapdragon > source-map-resolve > urix@0.1.0: Please see https://github.com/lydell/urix#deprecated
[2/4] Fetching packages...
error @npmcli/fs@1.1.0: The engine "node" is incompatible with this module. Expected version "^12.13.0 || ^14.15.0 || >=16". Got "10.24.0"
error Found incompatible module.
info Visit https://yarnpkg.com/en/docs/cli/upgrade for documentation about this command.
The command '/bin/sh -c yarn upgrade' returned a non-zero code: 1
ERROR: Service 'web' failed to build : Build failed
```

```
warning package-lock.json found. Your project contains lock files generated by tools other than Yarn. It is advised not to mix package managers in order to avoid resolution inconsistencies caused by unsynchronized lock files. To clear this warning, remove package-lock.json.

```

```

It is advised not to mix package managers in order to avoid resolution inconsistencies caused by unsynchronized lock files.
```

そのとおりでしかないので、package-lock.jsonを消した。npmとyarnを混在させてた。packge.jsonをどっちも使うから互換性あると思ってたが、lockファイルはまた別の話か。


```
 The engine “node” is incompatible with this module
```


が核となる部分か。


```
error @npmcli/fs@1.1.0: The engine "node" is incompatible with this module. Expected version "^12.13.0 || ^14.15.0 || >=16". Got "10.24.0"

```


nodeのバージョンが古いと怒られてる気がする


```
node -v
v16.13.1
```

ローカルではこうだったが、docker上では Got "10.24.0"となってるので
16系のnodeをインストールするDockerfileを記述したい。



Dockerfileにこのように記述してみた。

```Dockerfile

RUN curl -sL https://deb.nodesource.com/setup_16.x | bash - && \　#←ここ変更
    apt-get install -y nodejs

```


　docker-compose upを実行。




````
├─ wrap-ansi@5.1.0
├─ ws@8.4.0
├─ xtend@4.0.2
├─ yaml@1.10.2
├─ yargs-parser@13.1.2
├─ yargs@13.3.2
├─ yocto-queue@0.1.0
└─ youtube-player@5.5.2
Done in 116.92s.

````


RUN yarn upgrade

を突破した！！！やったぜ！！

```

s:46
webpacker_1        | 	return func(...args);
webpacker_1        | 	       ^
webpacker_1        | 
webpacker_1        | TypeError: Class constructor ServeCommand cannot be invoked without 'new'
webpacker_1        |     at runWhenInstalled (/coffee_passport/node_modules/webpack-cli/bin/utils/prompt-command.js:46:9)
webpacker_1        |     at promptForInstallation (/coffee_passport/node_modules/webpack-cli/bin/utils/prompt-command.js:140:10)
webpacker_1        |     at /coffee_passport/node_modules/webpack-cli/bin/cli.js:32:43
webpacker_1        |     at Object.<anonymous> (/coffee_passport/node_modules/webpack-cli/bin/cli.js:366:3)
webpacker_1        |     at Module._compile (node:internal/modules/cjs/loader:1101:14)
webpacker_1        |     at Object.Module._extensions..js (node:internal/modules/cjs/loader:1153:10)
webpacker_1        |     at Module.load (node:internal/modules/cjs/loader:981:32)
webpacker_1        |     at Function.Module._load (node:internal/modules/cjs/loader:822:12)
webpacker_1        |     at Module.require (node:internal/modules/cjs/loader:1005:19)
webpacker_1        |     at require (node:internal/modules/cjs/helpers:102:18)
coffee_passport_webpacker_1 exited with code 1

```

しかしwebpackerコンテナはこのようになってた。。

依存関係がやばいからだとおもうので、過去の自分の記事を参考に

```

https://qiita.com/divclass123/items/5cee396071540256e11e

```

Dockerfileに

```Dockerfile

RUN yarn upgrade-interactive --latest


```

これをついか。

この記事のように、このコマンドは対話型で、依存関係を直していくので、
RUN yarn upgrade-interactive --latest
このコマンド書くだけでは不十分なのではないか。


実際自分がローカルで、yarn upgrade-interactive --latestを叩いたときには

対話型の画面になって、aを押した後にエンターを押した。

RUN a 
RUN enter
とドッカーファイルに書くことができればいいのだが。。。


もしくは、COPY . /coffee_passport
でキャッシュが使われてる気がするので、

ローカルで依存を直しても、依存を直す以前のディレクトリがコピーされていたら全く意味がないので

```
docker-compose build --no-cache
```


を実行する必要があるのではないか。




```

Step 15/21 : RUN yarn upgrade-interactive --latest
 ---> Running in 5330c7208d1b
yarn upgrade-interactive v1.22.17
success All of your dependencies are up to date.
Done in 6.03s.

```

とdocker-composeのログをみたらなっていた。

つまり

```
 RUN yarn upgrade-interactive --latest
```

単体でも機能していた。
これで依存関係が治ればいいのだが、、。。。


```

Recreating coffee_passport_webpacker_1     ... error

ERROR: for coffee_passport_webpacker_1  cannot stop container: d0dea180963dc92a187a59c4a4Recreating coffee_passport_web_1           ... error
xit event

ERROR: for coffee_passport_web_1  cannot stop container: a07b86322e13b4796550a99f01af6c0fd4a2279a3f05e5b210eb06cd0a171c57: tried to kill container, but did not receive an exit event

ERROR: for webpacker  cannot stop container: d0dea180963dc92a187a59c4a462dfebc52a85d5071cfec4ef746f162dd59009: tried to kill container, but did not receive an exit event

ERROR: for web  cannot stop container: a07b86322e13b4796550a99f01af6c0fd4a2279a3f05e5b210eb06cd0a171c57: tried to kill container, but did not receive an exit event
ERROR: Encountered errors while bringing up the project.

```


依存関係とは別のエラーがでた。。。一旦dockerをまっさらにして、やり直そう。

コンテナが止まらないので、再起動。

すべてのネットワークと、ボリューム、コンテナを削除できた。



docker-compose build --no-cache


を実行。
--no-cacheつける意味ない気がするが念には念を




くそほど、長くロードされてる。



 ---> 69212fdb637b
Successfully built 69212fdb637b
Successfully tagged coffee_passport_webpacker:latest

Use 'docker scan' to run Snyk tests against images to find vulnerabilities and learn how to fix them


と一旦ビルドは成功。

 docker-compose up              

を実行。

```

[24] ./app/javascript/packs/components/about_coffee_passport.vue + 2 modules 3.2 KiB {3} {11} {12} {14} [built]
     |    3 modules
[25] ./app/javascript/packs/components/contact.vue + 2 modules 1.74 KiB {4} {11} {12} {14} [built]
     |    3 modules
[49] ./app/javascript/packs/router/router.js 469 bytes {11} {12} {14} [built]
[52] ./app/javascript/packs/components/static_pages/appExplain.vue + 4 modules 5.41 KiB {0} {9} [built]
     |    5 modules
[53] ./app/javascript/packs/components/footer.vue + 2 modules 1.16 KiB {6} {11} [built]
     |    3 modules
[60] ./app/javascript/packs/tag.js 5.77 KiB {1} {15} [built]
[61] ./app/javascript/packs/preview.js 2.77 KiB {1} {13} [built]
[64] ./app/javascript/packs/app_explain.js 329 bytes {0} [built]
[65] ./app/javascript/packs/application.js 911 bytes {1} [built]
[74] ./app/javascript/packs/footer.js 192 bytes {11} [built]
[89] ./app/javascript/packs/hello_vue.js + 5 modules 9.73 KiB {12} [built]
     | ./app/javascript/packs/hello_vue.js 2.19 KiB [built]
     | ./app/javascript/app.vue 552 bytes [built]
     | ./app/javascript/app.vue?vue&type=template&id=286cd28a&scoped=true& 213 bytes [built]
     | ./app/javascript/app.vue?vue&type=script&lang=js& 364 bytes [built]
     | ./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/vue-loader/lib??vue-loader-options!./app/javascript/app.vue?vue&type=template&id=286cd28a&scoped=true& 3.95 KiB [built]
     | ./node_modules/babel-loader/lib??ref--7-0!./node_modules/vue-loader/lib??vue-loader-options!./app/javascript/app.vue?vue&type=script&lang=js& 2.44 KiB [built]
[90] ./app/javascript/packs/components/Home.vue + 2 modules 826 bytes {2} [built]
     |    3 modules
    + 76 hidden modules

```

こんな感じでコンパイルも成功してそう。

だし、docekr-compose up成功してくれ、、、



webpacker_1        | /coffee_passport/node_modules/webpack-cli/bin/utils/prompt-command.js:46
webpacker_1        | 	return func(...args);
webpacker_1        | 	       ^
webpacker_1        | 
webpacker_1        | TypeError: Class constructor ServeCommand cannot be invoked without 'new'
webpacker_1        |     at runWhenInstalled (/coffee_passport/node_modules/webpack-cli/bin/utils/prompt-command.js:46:9)
webpacker_1        |     at promptForInstallation (/coffee_passport/node_modules/webpack-cli/bin/utils/prompt-command.js:140:10)
webpacker_1        |     at /coffee_passport/node_modules/webpack-cli/bin/cli.js:32:43
webpacker_1        |     at Object.<anonymous> (/coffee_passport/node_modules/webpack-cli/bin/cli.js:366:3)
webpacker_1        |     at Module._compile (node:internal/modules/cjs/loader:1101:14)
webpacker_1        |     at Object.Module._extensions..js (node:internal/modules/cjs/loader:1153:10)
webpacker_1        |     at Module.load (node:internal/modules/cjs/loader:981:32)
webpacker_1        |     at Function.Module._load (node:internal/modules/cjs/loader:822:12)
webpacker_1        |     at Module.require (node:internal/modules/cjs/loader:1005:19)
webpacker_1        |     at require (node:internal/modules/cjs/helpers:102:18)
coffee_passport_webpacker_1 exited with code 1


だめだぁ。。。・・・・


```

reating coffee_passport_db_1              ... done
Creating coffee_passport_selenium_chrome_1 ... done
Creating coffee_passport_webpacker_1       ... done
Creating coffee_passport_web_1             ... done
Attaching to coffee_passport_db_1, coffee_passport_webpacker_1, coffee_passport_web_1
db_1               | 2021-12-23 15:14:49+00:00 [Note] [Entrypoint]: Entrypoint script for MySQL Server 8.0.21-1debian10 started.
db_1               | 2021-12-23 15:14:49+00:00 [Note] [Entrypoint]: Switching to dedicated user 'mysql'
db_1               | 2021-12-23 15:14:49+00:00 [Note] [Entrypoint]: Entrypoint script for MySQL Server 8.0.21-1debian10 started.
db_1               | 2021-12-23 15:14:49+00:00 [Note] [Entrypoint]: Initializing database files
db_1               | 2021-12-23T15:14:49.935688Z 0 [System] [MY-013169] [Server] /usr/sbin/mysqld (mysqld 8.0.21) initializing of server in progress as process 44
db_1               | 2021-12-23T15:14:49.944995Z 1 [System] [MY-013576] [InnoDB] InnoDB initialization has started.
db_1               | 2021-12-23T15:14:50.495413Z 1 [System] [MY-013577] [InnoDB] InnoDB initialization has ended.
db_1               | 2021-12-23T15:14:52.240716Z 6 [Warning] [MY-010453] [Server] root@localhost is created with an empty password ! Please consider switching off the --initialize-insecure option.
webpacker_1        | /coffee_passport/node_modules/webpack-cli/bin/utils/prompt-command.js:46
webpacker_1        | 	return func(...args);
webpacker_1        | 	       ^
webpacker_1        | 
webpacker_1        | TypeError: Class constructor ServeCommand cannot be invoked without 'new'
webpacker_1        |     at runWhenInstalled (/coffee_passport/node_modules/webpack-cli/bin/utils/prompt-command.js:46:9)
webpacker_1        |     at promptForInstallation (/coffee_passport/node_modules/webpack-cli/bin/utils/prompt-command.js:140:10)
webpacker_1        |     at /coffee_passport/node_modules/webpack-cli/bin/cli.js:32:43
webpacker_1        |     at Object.<anonymous> (/coffee_passport/node_modules/webpack-cli/bin/cli.js:366:3)
webpacker_1        |     at Module._compile (node:internal/modules/cjs/loader:1101:14)
webpacker_1        |     at Object.Module._extensions..js (node:internal/modules/cjs/loader:1153:10)
webpacker_1        |     at Module.load (node:internal/modules/cjs/loader:981:32)
webpacker_1        |     at Function.Module._load (node:internal/modules/cjs/loader:822:12)
webpacker_1        |     at Module.require (node:internal/modules/cjs/loader:1005:19)
webpacker_1        |     at require (node:internal/modules/cjs/helpers:102:18)
coffee_passport_webpacker_1 exited with code 1
db_1               | 2021-12-23 15:14:55+00:00 [Note] [Entrypoint]: Database files initialized
db_1               | 2021-12-23 15:14:55+00:00 [Note] [Entrypoint]: Starting temporary server
db_1               | 2021-12-23T15:14:55.874976Z 0 [System] [MY-010116] [Server] /usr/sbin/mysqld (mysqld 8.0.21) starting as process 91
db_1               | 2021-12-23T15:14:55.894098Z 1 [System] [MY-013576] [InnoDB] InnoDB initialization has started.
db_1               | 2021-12-23T15:14:56.143204Z 1 [System] [MY-013577] [InnoDB] InnoDB initialization has ended.
db_1               | 2021-12-23T15:14:56.253183Z 0 [System] [MY-011323] [Server] X Plugin ready for connections. Socket: /var/run/mysqld/mysqlx.sock
db_1               | 2021-12-23T15:14:56.401692Z 0 [Warning] [MY-010068] [Server] CA certificate ca.pem is self signed.
db_1               | 2021-12-23T15:14:56.402164Z 0 [System] [MY-013602] [Server] Channel mysql_main configured to support TLS. Encrypted connections are now supported for this channel.
db_1               | 2021-12-23T15:14:56.407071Z 0 [Warning] [MY-011810] [Server] Insecure configuration for --pid-file: Location '/var/run/mysqld' in the path is accessible to all OS users. Consider choosing a different directory.
db_1               | 2021-12-23T15:14:56.434607Z 0 [System] [MY-010931] [Server] /usr/sbin/mysqld: ready for connections. Version: '8.0.21'  socket: '/var/run/mysqld/mysqld.sock'  port: 0  MySQL Community Server - GPL.
db_1               | 2021-12-23 15:14:56+00:00 [Note] [Entrypoint]: Temporary server started.
db_1               | Warning: Unable to load '/usr/share/zoneinfo/iso3166.tab' as time zone. Skipping it.
db_1               | Warning: Unable to load '/usr/share/zoneinfo/leap-seconds.list' as time zone. Skipping it.
db_1               | Warning: Unable to load '/usr/share/zoneinfo/zone.tab' as time zone. Skipping it.
db_1               | Warning: Unable to load '/usr/share/zoneinfo/zone1970.tab' as time zone. Skipping it.
db_1               | 
db_1               | 2021-12-23 15:14:59+00:00 [Note] [Entrypoint]: Stopping temporary server
db_1               | 2021-12-23T15:14:59.658326Z 10 [System] [MY-013172] [Server] Received SHUTDOWN from user root. Shutting down mysqld (Version: 8.0.21).
db_1               | 2021-12-23T15:15:01.954163Z 0 [System] [MY-010910] [Server] /usr/sbin/mysqld: Shutdown complete (mysqld 8.0.21)  MySQL Community Server - GPL.
db_1               | 2021-12-23 15:15:02+00:00 [Note] [Entrypoint]: Temporary server stopped
db_1               | 
db_1               | 2021-12-23 15:15:02+00:00 [Note] [Entrypoint]: MySQL init process done. Ready for start up.
db_1               | 
db_1               | 2021-12-23T15:15:02.932785Z 0 [System] [MY-010116] [Server] /usr/sbin/mysqld (mysqld 8.0.21) starting as process 1
db_1               | 2021-12-23T15:15:02.943118Z 1 [System] [MY-013576] [InnoDB] InnoDB initialization has started.
db_1               | 2021-12-23T15:15:03.122522Z 1 [System] [MY-013577] [InnoDB] InnoDB initialization has ended.
db_1               | 2021-12-23T15:15:03.216008Z 0 [System] [MY-011323] [Server] X Plugin ready for connections. Bind-address: '::' port: 33060, socket: /var/run/mysqld/mysqlx.sock
db_1               | 2021-12-23T15:15:03.332617Z 0 [Warning] [MY-010068] [Server] CA certificate ca.pem is self signed.
db_1               | 2021-12-23T15:15:03.332862Z 0 [System] [MY-013602] [Server] Channel mysql_main configured to support TLS. Encrypted connections are now supported for this channel.
db_1               | 2021-12-23T15:15:03.336670Z 0 [Warning] [MY-011810] [Server] Insecure configuration for --pid-file: Location '/var/run/mysqld' in the path is accessible to all OS users. Consider choosing a different directory.
db_1               | 2021-12-23T15:15:03.357237Z 0 [System] [MY-010931] [Server] /usr/sbin/mysqld: ready for connections. Version: '8.0.21'  socket: '/var/run/mysqld/mysqld.sock'  port: 3306  MySQL Community Server - GPL.

```

しかもwebコンテナがdoneになってるのにログに表示されないし
localhost:3000も受け付けてくれない。
このページは動作してませんとなる・


soichirohara@SoichironoMacBook-Pro coffee_passport % docker-compose ps
           Name                         Command             State              Ports           
-----------------------------------------------------------------------------------------------
coffee_passport_db_1          docker-entrypoint.sh --def    Up       0.0.0.0:3306->3306/tcp,   
                              ...                                    33060/tcp                 
coffee_passport_selenium_ch   /opt/bin/entry_point.sh       Up       4444/tcp, 5900/tcp        
rome_1                                                                                         
coffee_passport_web_1         entrypoint.sh ./bin/rails     Up       0.0.0.0:3000->3000/tcp    
                              ...                                                              
coffee_passport_webpacker_1   entrypoint.sh ./bin/webpac    Exit 1                             
                              ...                                   



coffee_passport_web_1   コンテナ立ち上がってるはずなのに。。。



````

coffee_passport/node_modules/webpack-cli/bin/utils/prompt-command.js:46

return func(...args);

       ^


TypeError: Class constructor ServeCommand cannot be invoked without 'new'

    at runWhenInstalled (/coffee_passport/node_modules/webpack-cli/bin/utils/prompt-command.js:46:9)

    at promptForInstallation (/coffee_passport/node_modules/webpack-cli/bin/utils/prompt-command.js:140:10)

    at /coffee_passport/node_modules/webpack-cli/bin/cli.js:32:43

    at Object.<anonymous> (/coffee_passport/node_modules/webpack-cli/bin/cli.js:366:3)

    at Module._compile (node:internal/modules/cjs/loader:1101:14)

    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1153:10)

    at Module.load (node:internal/modules/cjs/loader:981:32)

    at Function.Module._load (node:internal/modules/cjs/loader:822:12)

    at Module.require (node:internal/modules/cjs/loader:1005:19)

    at require (node:internal/modules/cjs/helpers:102:18)

```


webpackerコンテナ全体のログはこんな感じ




TypeError: Class constructor ServeCommand cannot be invoked without 'new'

をググったら。

```

これは今のところうまくいきました。package.jsonファイルのwebpack-dev-serverバージョンを次のように変更します。

"webpack-dev-server": "~3"
そして、yarn installまたはを実行しnpm installます。

ソース：https：//stackoverflow.com/a/69050300/2774342

PSこれは一時的な解決策になる可能性がありますが、新しいバージョンがリリースされるため、将来の参照（数か月後だと思います）のために、この回答は非推奨になります。

```


https://github.com/webpack/webpack-cli/issues/2272


https://stackoverflow.com/questions/69046801/brand-new-rails-6-1-4-1-fails-with-webpack-error-typeerror-class-constructor


とかいてあったので




webpack-dev-serverをバージョン3のままにする
これを行うには、package.jsonファイルを更新します。

package.json

```
"webpack-dev-server": "~3"

```

をこうする。

```

- RUN bundle exec rails webpacker:compile

```

```
- RUN yarn upgrade-interactive --latest


```


をけした。コンパイル専用のコンテナがあるので、わざわざDockerfileに記述しなくてもいいとおもった。

- RUN yarn upgrade-interactive --latest

は

"webpack-dev-server": "~3"とバージョンを固定したいので、

アップデートをしてしまうコマンドを削除

```
RUN yarn install --check-files
```

を追記




```

docker-compose up

```


で成功！！

やったぜ！！


# 上手く言ったdockerfileとdocker-compose.yml


```Dockerfile

FROM ruby:2.6.5

## nodejsとyarnはwebpackをインストールする際に必要
# yarnパッケージ管理ツールをインストール

RUN curl http://deb.debian.org/debian/dists/buster/main/binary-amd64/by-hash/SHA256/935deda18d5bdc25fb1813d0ec99b6e0e32a084b203e518af0cf7dc79ee8ebda | head

RUN apt-get update && apt-get install -y curl apt-transport-https wget && \
curl -sS https://dl.yarnpkg.com/debian/pubkey.gpg | apt-key add - && \
echo "deb https://dl.yarnpkg.com/debian/ stable main" | tee /etc/apt/sources.list.d/yarn.list && \
apt-get update && apt-get install -y yarn  && apt-get install -y graphviz

RUN curl -sL https://deb.nodesource.com/setup_16.x | bash - && \
    apt-get install -y nodejs


# chromeの追加
RUN apt-get update && apt-get install -y unzip && \
    CHROME_DRIVER_VERSION=`curl -sS chromedriver.storage.googleapis.com/LATEST_RELEASE` && \
    wget -N http://chromedriver.storage.googleapis.com/$CHROME_DRIVER_VERSION/chromedriver_linux64.zip -P ~/ && \
    unzip ~/chromedriver_linux64.zip -d ~/ && \
    rm ~/chromedriver_linux64.zip && \
    chown root:root ~/chromedriver && \
    chmod 755 ~/chromedriver && \
    mv ~/chromedriver /usr/bin/chromedriver && \
    sh -c 'wget -q -O - https://dl-ssl.google.com/linux/linux_signing_key.pub | apt-key add -' && \
    sh -c 'echo "deb [arch=amd64] http://dl.google.com/linux/chrome/deb/ stable main" >> /etc/apt/sources.list.d/google-chrome.list' && \
    apt-get update && apt-get install -y google-chrome-stable

RUN /bin/sh -c /bin/sh -c bundle update --bundler
RUN gem install bundler:2.1.4

RUN mkdir /coffee_passport
WORKDIR /coffee_passport
COPY . /coffee_passport
COPY Gemfile /coffee_passport/Gemfile
COPY Gemfile.lock /coffee_passport/Gemfile.lock
# RUN bundle update rails
# RUN bundle update
# RUN bundle update mimemagic
# RUN bundle update capybara selenium-webdriver
#RUN bundle update nokogiri marcel mimemagic

RUN bundle install
RUN yarn upgrade
#RUN yarn upgrade-interactive --latest
#RUN bundle exec rails webpacker:comp
RUN yarn install --check-files

# Add a script to be executed every time the container starts.
COPY entrypoint.sh /usr/bin/
RUN chmod +x /usr/bin/entrypoint.sh
ENTRYPOINT ["entrypoint.sh"]
EXPOSE 3000

# Start the main process.
CMD ["rails", "server", "-b", "0.0.0.0"]
```


```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
```