Nuxt.jsをDockerで動かすための手順をまとめました。
ビルド用のshell
docker内にソースをコピーしてビルドではなく、先にビルドしてからイメージを作ります。
#!/bin/sh
APP_NAME=xxx-app
npm run build
docker build -t $APP_NAME:latest ./
Dockerfile
Dockerイメージのサイズを小さくするためにベースはalpineを使っています。
また、必要最小限のファイルのみで固めるためにnpm install は productionを指定しています。これによりdevDependenciesがimportされなくなります。
その後、必要なファイルをCOPYすることで必要最低限となるためDockerイメージを最小限にできます。
FROM node:8.15.0-alpine
ENV LANG C.UTF-8
WORKDIR /opt/docker
COPY package.json .
RUN apk add --no-cache --virtual python2 \
&& npm install -g vue-cli \
&& npm install --production \
&& apk del python2
COPY .nuxt ./.nuxt/
COPY nuxt.config.js .
COPY static ./static/
ENV HOST 0.0.0.0
EXPOSE 3000
VOLUME ["/opt/docker"]
# start command
CMD [ "npm", "run", "start" ]
docker-compose.yml
必要最小限の定義です。
version: "3"
services:
xxx-hp:
restart: always
image: xxx-hp:latest
container_name: xxx-hp
ports:
- "3000:3000"
logging:
options:
max-size: 5m
environment:
TZ: Asia/Tokyo
本番で動かす場合はネットワークの定義も書いたほうがいいです。