Issue
create-react-app & typescriptでアプリが完成したが、良さそうなDockerfileとdocker-compose.ymlが無い。
解決策
過去のプロジェクトからとってきた。
今後検索で引っ掛かるようにここで共有する。
前提
- Dockerfileとdocker-composeの知識がある前提なので、わからなければ公式サイトで勉強することを勧める。
- CRAはEjectしていない前提である。
実装
Dockerfile
FROM node:14-alpine AS builder
# set working directory
WORKDIR /app
# Copies package.json and yarn.lock to Docker environment
COPY package.json ./
COPY yarn.lock ./
# Install `serve` to run the application.
RUN npm install -g serve
# Installs all node packages
RUN yarn install --frozen-lockfile
# Copies everything over to Docker environment
COPY . .
# Build for production.
RUN yarn build
# Uses port which is used by the actual application
EXPOSE 5000
# Run application
#CMD [ "npm", "start" ]
CMD serve -s build
docker-compose.yml
version: "3"
services:
my_webapp:
build:
context: .
volumes:
- ./src:/app/src # 多分これはいらないかも。
ports:
- "5000:5000"
あとは、以下のコマンドでローカルと本番環境で実行できる。
docker-compose build
-> ビルドを作る
docker-compose up -d
-> バックグラウンドで実行する
Portの設定は<HOST>:<CONTAINER>
になる。なので、- "5000:5000"
の後の部分を変えずに最初の部分だけをホストマシンのポートに設定する。後の部分を変えるのであれば、Dockerfile
のEXPOSE 5000
と同じ値である必要がある。
以上。
ハッピーコーディング!