`node_modules`の取り扱いには注意が必要

Dockerを利用して環境構築をする際にはnode_modulesの取り扱いに注意する必要があります。
何も意識していないとホスト側でyarn installなどをしてしまうとエラーが発生することがあります。

またyarn installなどをDockerfileで実行した際にnode_modulesが削除されたりします。

以下の記事ではコンテナ内のnode_modulesが消える問題の改善方法について記載しています。

しかし、上記の記事に記載している方法ではホスト側のnode_modulesが空になってしまいます。
その改善方法については以下の記事にまとめました。

記事のように設定するとホスト側にnode_modulesの中身を表示できますが、ホスト側の変更がコンテナ内に反映されてしまいます。
ホスト側でyarn installなどをするとエラーの原因となるため、今回はホスト側のnode_modulesが空になる問題の改善方法について記載します。
Next.jsの環境で試したのでNext.jsで記載しますが他でも応用可能と思います。

ホスト側で`yarn install`などを不可にする

ホスト側でyarn installやyarn addをするとエラーが出るようにすることで対応します。
まず、.yarnrcを作成します。

そして以下のように記述します。

.yarnrc

--modules-folder /myapp/node_modules

yarnを使用した際に--modules-folder /myapp/node_modulesがつくようになります。

--modules-folderについては以下をご参照ください。

次にDockerfileを以下のようにします。

Dockerfile

FROM node:16.14.2

ENV USER_NAME=myuser
ENV TZ=Asia/Tokyo
# PATH 追記
ENV PATH="/myapp/node_modules/.bin:$PATH"

WORKDIR /myapp

# .yarnrc 追記
COPY package.json yarn.lock .yarnrc ./
RUN yarn install --frozen-lockfile

RUN adduser ${USER_NAME} && \
  chown -R ${USER_NAME} /myapp
USER ${USER_NAME}

EXPOSE 3000
CMD ["yarn", "dev"]

これで、yarn installをホスト側で実行すると以下のようなエラーが出てyarn installできなくなります。

ターミナル

$ yarn install
yarn install v1.22.17
[1/4] 🔍  Resolving packages...
[2/4] 🚚  Fetching packages...
[3/4] 🔗  Linking dependencies...
error An unexpected error occurred: "EROFS: read-only file system, mkdir '/myapp'".
info If you think this is a bug, please open a bug report with the information provided
in "/Users/user_name/Documents/sources/docker-next-test/Next/yarn-error.log".
info Visit https://yarnpkg.com/en/docs/cli/install for documentation about this command.

yarn addも同様です。

ターミナル

$ yarn add <package>
yarn add v1.22.17
[1/5] 🔍  Validating package.json...
[2/5] 🔍  Resolving packages...
[3/5] 🚚  Fetching packages...
[4/5] 🔗  Linking dependencies...
error An unexpected error occurred: "EROFS: read-only file system, mkdir '/myapp'".
info If you think this is a bug, please open a bug report with the information provided
in "/Users/user_name/Documents/sources/docker-next-test/Next/yarn-error.log".
info Visit https://yarnpkg.com/en/docs/cli/add for documentation about this command.

また、これはホスト側でyarn installなどを不可にする他にも、以下のような事象を改善します。

node_modulesにボリュームを設定した状態で、以下を実行するとコンテナ側のnode_modulesが空になります。

ターミナル

$ docker compose run --rm front yarn create next-app --ts myapp_name && \
  cd $_ && mv * .* .. && rmdir ${PWD} && cd ../

ホスト側でプロジェクトのルートディレクトリに展開するためこのように実行しています。

しかしこれでは、コンテナ内の/myapp/node_modulesに変更が反映されません。
コンテナ内のnode_modulesは空のままであるため、docker compose upするとエラーが出ます。

ターミナル

$ docker compose up
[+] Running 1/0
 ⠿ Container next-front-1  Created                                                0.1s
Attaching to next-front-1
next-front-1  | yarn run v1.22.18
next-front-1  | $ next dev
next-front-1  | /bin/sh: 1: next: not found
next-front-1  | info Visit https://yarnpkg.com/en/docs/cli/run for documentation about
this command.
next-front-1  | error Command failed with exit code 127.
next-front-1 exited with code 127

.yarnrcを前述のとおり作成すると/myapp/node_modulesにインストールされるようになるため、この問題も改善されます。

これでyarn installなどはできなくなりましたが、まだnpm installはできてしまいます。
node_modulesが存在しない状態でホスト側でnpm installしたり、ホスト側でnpm ciを実行してしまうとエラーの原因となることがあります。
詳細は以下をご参照ください。

また、yarnを使用しているのにnpm installしてしまうとyarn.lockの他にpackage-lock.jsonも作成されてしまいます。
そのため、次はnpm installもできないようにします。
npm installをできないようにする方法は以下をご参照ください。

yarn V3の場合

警告
以降に記述した方法ではDependabotを使用した際に以下のようなエラーとなることがわかりました。

ご注意ください

yarn V3の場合には.yarnrcではなく、.yarnrc.ymlを使用する必要があります。
.yarnrc.ymlに以下のように記述することで同じことができます。

.yarnrc.yml

yarnPath: .yarn/releases/yarn-3.2.0.cjs
cacheFolder: "/myapp/.yarn/cache"

yarn V3はnode-modulesではなくcacheフォルダ経由で依存関係を解決しています。
そのため、cacheフォルダのパスを指定することでホスト側でyarn addをするとエラーが出るようにできます。

ターミナル

$ yarn add  <package>
Internal Error: ENOENT: no such file or directory, mkdir '/myapp'
Error: ENOENT: no such file or directory, mkdir '/myapp'

yarn installでも同様です。

ターミナル

$ yarn install
Internal Error: ENOENT: no such file or directory, mkdir '/myapp'
Error: ENOENT: no such file or directory, mkdir '/myapp'