VS Code / Remote - Containers で docker-compose を試す

VS Code / Remote - Containers を使用して Docker Compose 上のソースコードに対してリモート開発を試してみました。
H.KAMIYAMA
@alclimb

VS Code でリモートマシンや Docker コンテナ上のワークスペースを開いてリモートで開発ができる機能が追加されました。

今回は VS Code / Remote - Containers を使用して Docker Compose 上のソースコードに対してリモート開発を試してみました。

なお、VS Code / Remote - Containers の Docker 単体の動作を確認したい場合は 公式にサンプル があります。

環境

  • Windows 10 Pro 64bit: v1903
  • Docker Desktop for Windows: v2.0.0.3 (31259)
    • Engine: v18.09.2
    • Compose: v1.23.2
  • Visual Studio Code: v1.36.1
    • Remote - Containers: v0.66.0

コード

Remote - Containers の設定
docker 単体ではなく、docker-compose を利用する場合は dockerComposeFile, service, workspaceFolder の指定が必要。

.devcontainer / devcontainer.json
{ "name": "docker_web_app", "dockerComposeFile": "./docker-compose.yml", "service": "web-nodejs", "workspaceFolder": "/var/nodeapp/", "appPort": 3000, "extensions": [], "settings": { "terminal.integrated.shell.linux": "/bin/bash" } }

docker-compose の設定
command: sleep infinity でコンテナが落ちないように。

.devcontainer / docker-compose.yml
version: "3.7" services: # # nodejsサーバー # web-nodejs: restart: "no" image: node:10.16 volumes: - ../:/var/nodeapp/ working_dir: /var/nodeapp/ ports: - "3000:3000" command: sleep infinity

Node.js の設定

package.json
{ "name": "docker_web_app", "version": "1.0.0", "description": "Node.js on Docker", "author": "H.KAMIYAMA", "main": "src/server.js", "scripts": { "start": "node ." }, "dependencies": { "express": "^4.17.1" } }

Node.js アプリケーションコード

src / server.js
'use strict'; const express = require('express'); // Constants const PORT = 3000; // App const app = express(); app.get('/', (req, res) => { const now = new Date(); res.send(`Hello remote world!<br />${now}`); }); app.listen(PORT); console.log(`Running on http://localhost:${PORT}`);

実行結果

参考

Reference / devcontainer.json
Reference / docker-compose.yml

WRITER
H.KAMIYAMA
@alclimb
SERIES
この記事に連載はありません。
READ NEXT
COMMENTS
コメント機能は開発中です。実装完了まで今しばらくお待ちください。