今回達成すること
Nuxt.js用のDockerfileを作成します。
また、Dockerfileで指定する「LANG=C.UTF-8」の意味についても解説していきます。
Nuxt.js用のDockerfileを作成する
前回の続きの場合、apiディレクトリにいます。
そこからfrontディレクトリへ移動しましょう。
api $ cd ../front
Dockerfileの作成
frontディレクトリ直下にDockerfileを作成します
front $ touch Dockerfile
確認します。
front $ ls
Dockerfile
Dockerfileの編集
下記のように編集します。
2020年6月13日 追記
$docer-compose buildコマンドでエラーが出るため下記コードを修正しました。すみません。
変更前 ... RUN echo HOME=>${HOME}
変更後 ... RUN echo ${HOME}
削除したコード3つ（本番用のコードのため後で記述）
COPY package*.json ./
RUN yarn install
COPY . .
下記ファイルは修正済みのコードとなります。
front/Dockerfile
# FROM node:14.4.0-alpine 使用不可
FROM node:16.13.1-alpine
ARG WORKDIR
ARG CONTAINER_PORT
ENV HOME=/${WORKDIR} \
LANG=C.UTF-8 \
TZ=Asia/Tokyo \
HOST=0.0.0.0
# ENV check（このRUN命令は確認のためなので無くても良い）
RUN echo ${HOME}
RUN echo ${CONTAINER_PORT}
WORKDIR ${HOME}
EXPOSE ${CONTAINER_PORT}
# 2021.12.13追記
# FROM node:14.15.1-alpine
# node v14.15.1は、$ yarn create nuxt-app appコマンド時に下記エラーが発生するので使用不可
# eslint-plugin-vue@8.2.0: The engine "node" is incompatible with this module. Expected version "^12.22.0 || ^14.17.0 || >=16.0.0". Got "14.15.1"
# create nuxt-appコマンド成功確認済みのnode version
# FROM node:16.13.1-alpine
# or
# FROM node:16-alpine(node v16.13.1)
# 現在のnode推奨版はこちらから => https://nodejs.org/ja/download/
Dockerfileの参考元
Dockerfileを一つ一つ説明するぞう
それではNuxt.jsを構築するDockerfileを説明します。
なお、前回の記事 #Dockerfileを一つ一つ説明するぞうで説明した項目は飛ばします。
FROM node:14.4.0-alpine
Alpineベースのnodeをベースイメージとしています。
最新のバージョンはこちらから確認できます。
ENV HOST=0.0.0.0
これを指定しないとブラウザからhttp://localhost へアクセスすることができません。
RailsのDockerfileで指定した、CMD ["rails", "server", "-b", "0.0.0.0"]と同じ意味を持つんですね。
-
前回の記事（Rails6を動かすAlpineベースのDockerfileを作成する）を一部抜粋
仮想環境で起動したRailsは、localhostのipアドレス「127.0.0.1」でアクセスできません。
そこで仮想外部からアクセスできるように、ip「0.0.0.0」に紐付けをする必要があるのです。
これにより、自分のPC上のブラウザでRailsにアクセスできるようになるのです。
参考
EXPOSE <ポート番号>
コンテナ公開用のポート番号を指定します。
今回は、docker-compose.ymlのportsで「8080」を指定するので、ここには3000番を入れています。
LANG=C.UTF-8とは何なのか?
RailsのDockerfileでも指定しましたが、ENV命令にLANG=C.UTF-8を指定しています。
LANGとは
language（ランゲージ）を意味するもので、「アプリケーションの中で使用する言語を明示する」役割があります。
C.UTF-8とは
2つに分けて説明します。
-
Cとは言語を表すもので、コンピューターのルールに沿った
en_US（英語）を意味します。一見、
en_US.UTF-8と同じように思えますが、並べ替えの順序や桁区切り記号、デフォルトの通貨記号などに違いがあるようです。ちなみに日本語は
ja_JPと指定します。 -
UTF-8とは文字コードを表します。
コンピューターはそもそも計算機なので、文字も数字として認識しています。
そこで、「この文字は○○番」「この記号は○○番」と割り当てる必要があります。
この割り当てられた番号を文字コードと言います。
この文字コードには様々な種類があり、その中でも
UTF-8は世界中のソフトウェアで最も使用されている文字コードです。たまにありませんか?
エクセルで開いたCSVが文字化けすること。
あれは割り当てられた文字コードが無いために起こる現象です。
日本語に対応する場合は、良く
Shift_JISが使われます。
つまりLANG=C.UTF-8とは、
- コンピューター用の英語を、
- 文字コードUTF-8で利用する
と明示しています。
日本語アプリケーションなのに「ja_JP」じゃダメなの?
ja_JPに対応していないOSやソフトウェアの場合はエラーを引き起こします。
そもそもソフトウェアへの命令や操作を行う場合は英語です。
また、C.UTF-8でもアプリケーション内の日本語入出力には問題ありません。
理由がない限りC.UTF-8で良いでしょう。
まとめ
今回はNuxt.js用のDockerfileを作成しました。
ポイントをまとめておきましょう。
- Alpineベースのnodeイメージには最初からyarnがインストールされている
- 環境変数に
HOST=0.0.0.0を指定しないとブラウザからコンテナへアクセスできない C.UTF-8のCとは、コンピューター用のen_US（英語）を意味するja_JP.UTF-8は、理由がない限り使わない方が良い
次回予告
ここまでにRailsとNuxt.js用のDockerfileを作成しました。
次回はこの2つのDockerfileを一括操作する「docker-compose.yml」を編集していきたいのですが。。。
ちょっとその前にDocker運用を楽にする環境変数のお話を。
↓下のリンクよりお進みください。それでは！
修正情報
-
2020年11月25日
ENV HOST=0.0.0.0へ参考リンクを追加しました。
-
2021年12月13日
Dockerfileのnode versionを変更しました。