概要
- Docker初めて使います。
- VSCodeのシンタックスハイライトを作るためにyeomanをインストールしたかったのですが、npmが必要とのことでした。
- 単純にWSL2でnpm installしても良かったのですが、WSL2の環境を汚したくないのでDockerのコンテナの中で作業したいと思いました。
事前準備
- WSL2: Ubuntu-20.04
- Docker : Docker version 20.10.8, build 3967b7d
Docker-composeのための準備
WSL2の中に下記構成でファイルを作っておきます。
~/node-docker$ tree -f
.
├── ./docker-compose.yml
└── ./node
└── ./node/Dockerfile
次にdocker-compose.ymlとDockerfileを書いていきます。ベースとしているのは参考記事Docker-composeを使ってnode.jsの環境構築をしてみたのよ。中のコードです。npm installやimageの部分だけ変えています。
今回は./node/appを作業ディレクトリとしたいので、次のdocker-compose.ymlには次のように書いておきます。
version: '3'
services:
webserver:
build: node
image: node:latest #ここだけ変えました。
tty: true
volumes:
- ./node/app:/app
ports:
- "8080:3000"
yoをインストールするため、Dockerfileは次のように書いておきます。
# ベースイメージを指定
FROM node
# node.js の環境変数を定義する
# 本番環境では production
ENV NODE_ENV=development
# 雛形を生成するのに必要なパッケージのインストール
RUN npm install -g yo generator-code #ここだけ変えました。
# ディレクトリを移動する
WORKDIR /app
# ポート3000番を開放する
EXPOSE 3000
コンテナに入るまで
ここからは参考に記載したDocker-composeを使ってnode.jsの環境構築をしてみたのよ。と全く同じ手順で進みます。
最初にbuildします。初回は必要らしいです。
$ docker-compose build
[+] Building 20.5s (3/6)
=> [internal] load build definition from Dockerfile
=> => transferring dockerfile: 390B
中略
=> => naming to docker.io/library/node:latest
Use 'docker scan' to run Snyk tests against images to find vulnerabilities and learn how to fix them
イメージが作成されているか確認します。
$ docker images
REPOSITORY TAG IMAGE ID CREATED SIZE
node latest 9687fd56f5e5 26 seconds ago 982MB
コンテナを起動し、中に入ってみます。
$ docker-compose up -d
[+] Running 2/2
⠿ Network node-docker_default Created
⠿ Container node-docker_webserver_1 Started
$ docker exec -it node-docker_webserver_1 /bin/sh
#
yoがインストールされているか確認してみます。
# yo --version
4.3.0
作業の終わりかた
- コンテナから
exitで抜けます。 -
docker-compose stopでコンテナを停止します。
もう一度始めたいとき
-
docker-compose restartでコンテナ起動します。 -
docker exec -it <コンテナ名> /bin/shでコンテナの中に入れます。
開発を終わるとき
docker-compose downでコンテナが削除されます。
終わりに
書いてて思いましたが、WSL2を使ってるものの特徴的な部分はありませんね。強いて言うならWSL1→2の移行とDockerDesktopのインストールが手間取りましたが、他の方が散々やっているのでこの記事では書きません。
yoのインストールは他の参考記事を見てもnpmバージョンが原因なのかうまくインストールできなかったので、どのimageを使ったかのメモとして記事を残しておきたいと思います。
参考
Visual Studio CodeでCode Syntax Highlight Extentionを作る
Docker-composeを使ってnode.jsの環境構築をしてみたのよ。
【Docker】docker-composeコマンド早見表
docker-compose up とか build とか start とかの違いを理解できていなかったのでまとめてみた