VisualStudioCode用のDockerプラグインの使用方法

投稿日: 2022-04-20 2022-10-24
タグ: Development, Docker, VS Code

序章

この記事では、VisualStudioCode用のDockerプラグインを使用します。 Dockerを使用すると、アプリケーションをイメージにパッケージ化し、Dockerがインストールされている任意のプラットフォームでコンテナーとして実行できます。このプラグインは、Node.jsとGoの2つの開発者スタックで使用します。

インストール

ワークステーションにDockerをインストールする必要があります。 Dockerのインストールと実行方法の説明は、ここで入手でき、実行している特定のオペレーティングシステムに固有である必要があります。

また、 Visual StudioCodeがインストールされている必要があります。

Visual Studio Codeをインストールしたら、それを開いて、左端のペインの拡張機能セクションをクリックし、Dockerを検索します。

インストールすると、VisualStudioCodeインスタンスにいくつかの新しいことがわかります。左端のペインには、Dockerロゴが付いた新しいDockerセクションがあり、クリックすると3つのセクションがあるDockerExplorerが開きます。画像、コンテナ、レジストリ

コマンドパレットにはいくつかのコマンドが追加されており、コマンドパレットを開いて入力することで表示できます。 docker .

Node.js

Node.jsアプリケーションを使用して、DockerプラグインがVSCodeに追加する機能を示します。

Expressサーバーを作成しましょう。

mkdir docker-node
cd docker-node
npm init -y
npm install --save express
touch index.js

次のようなディレクトリツリーが必要です。

.
├── index.js
├── node_modules
├── package-lock.json
└── package.json

1 directory, 3 files

これはの内容です index.js

index.js

const express = require('express')
const app = express()

app.listen(3000)

app.get('/', (req, res) => {
  res.send('hello world')
})

アップデート package.json 開始スクリプトがあります。

package.json

"scripts": {
    "start": "node index.js"
  },

これで、このアプリを次のように簡単に実行できます npm start、およびポートに移動します 3000 アプリが機能していることを確認します。

従来、Dockerを追加するには、次の手順に従います。

Dockerfile（またはdocker-compose.yaml）を作成します
Docker命令をファイルに追加します（FROM、WORKDIR、ADD、EXPOSE、CMD）
走る docker build... ターミナルでイメージを作成します
走る docker run... ターミナルでコンテナを実行します

ただし、プラグインを使用する場合は、次のことを行う必要があります。コマンドパレットを開き、入力します docker、次に選択します Docker: Add Docker files to Workspace. それは最初のオプションでなければなりません。プレス Enter プラットフォーム/スタックを選択し、Node.jsを選択して、を押すように求められます Enter. 次に、ポートを選択するように求められます。書く 3000 これは、アプリがリッスンするポートであるためです。次のファイルがワークスペースに追加されます。 .dockerignore, docker-compose.debug.yml, docker-compose.yml、と Dockerfile.

The .dockerignore ビルドイメージにファイルを追加するときにリストされているファイルを無視するようにdockerに指示します。

The docker-compose.debug.yml 実行できるようになります docker-compose 検査して、デバッガーを接続します。

version: '2.1'

services:
  docker-node:
    image: docker-node
    build: .
    environment:
      NODE_ENV: development
    ports:
      - 3000:3000
      - 9229:9229
    command: node --inspect=0.0.0.0:9229 index.js

ただし、開発中にデバッグしている場合は、ローカルマシンで行った変更がコンテナに保持されるように、ボリュームをアタッチする必要がある場合があります。

The docker-compose.yml fileは、docker-servicesの実行に使用される標準のdocker-composeファイルです。データベース接続やロードバランサーなどの他のリソース/サービスを追加するときは、このファイルを編集します。

version: '2.1'

services:
  docker-node:
    image: docker-node
    build: .
    environment:
      NODE_ENV: production
    ports:
      - 3000:3000

The Dockerfile、ここで最も重要なのは、ビルドする必要があるため、プラグインがインストールされていない場合に手動で作成する必要がある命令が含まれていることです。

FROM node:8.9-alpine
ENV NODE_ENV production
WORKDIR /usr/src/app
COPY ["package.json", "package-lock.json*", "npm-shrinkwrap.json*", "./"]
RUN npm install --production --silent && mv node_modules ../
COPY . .
EXPOSE 3000
CMD npm start

次に、イメージをビルドするには、VS Codeコマンドパレットを開いて、次のように入力します docker 次に、 Docker: Build Image を押して Enter. Dockerfileを選択し、それを選択してを押すように求められます Enter. 次に、タグを選択するように求められます。デフォルトのままにします docker-node 選択してを押します Enter. 統合ターミナルが開き、ビルドログが表示されます。

最後に、コンテナを実行する必要があります。もう一度、コマンドパレットを開き、入力します docker run、選択 Docker: Run システム内のすべてのコンテナのリストが表示されます。選択してください docker-node:latest、タグ付けしたものを押して Enter. ターミナルには、実行コマンドのログが表示されます。追加されたことに注意してください -p 3000:3000 ポートをホストマシンに公開して、次のサイトにアクセスしてアプリケーションを実行できるようにします localhost:3000.

左側のペインに移動してDockerセクションを選択し、 Images でを選択して、コンテナーを実行することもできます。 docker-node 画像、右クリックして実行をクリックします。同じログがターミナルで実行されます。

上記の画像セクションには、システム内の画像のリストがあることにも気付くでしょう。 docker-nodeコンテナーが実行されると、同じセクションで実行中のコンテナーを確認し、停止することもできます。その上、 Attach Shell が選択されています。これは、以下のdockerコマンドと同等です。

docker exec -it <container> sh

これは、以下の端末ログ出力を示しています。

コンテナ内にいることがわかり、コンテナ内のファイルを一覧表示できます。

コンテナを停止し、docker-composeを使用してアプリを実行してみてください。コマンドパレットを開き、docker-composeを見つけて、出力を確認します。

行け

Golangに慣れていない場合は、次のトピックにスキップできます。

DockerもGoで構築されています

Goアプリを作成しましょう。

mkdir docker-go
cd docker-go
touch main.go

ディレクトリツリーには1つのファイルがあります。

.
└── main.go

0 directories, 1 file

これがのコンテンツです main.go ファイル。

main.go

package main

import (
	"log"
	"net/http"
)

func helloHandler(w http.ResponseWriter, r *http.Request) {
	w.Write([]byte("Hello World"))
}

func main() {
	http.HandleFunc("/", helloHandler)

	if err := http.ListenAndServe(":9000", nil); err != nil {
		log.Fatalln("ListenAndServer Error", err)
	}
}

次のコマンドでアプリを実行できます。

go run main.go

ただし、VSCode Dockerプラグインを使用してイメージを構築し、コンテナーを実行してみましょう。

コマンドパレットを開き、Dockerと入力して、[Dockerfile]を選択します。 Docker: Add Dockerfile to Workspace.

プラットフォームを選択するように求められます。 Go を押して Enter.

次に、ポートを選択し、ポートに書き込むように求められます 9000、アプリで選択したポートなので、を押します Enter.

以下の4つのファイルが作成されます。 .dockerignore, docker-compose.debug.yml, docker-compose.yml、と Dockerfile.

The .dockerignore fileは、イメージにファイルを追加するときに一部のファイルを無視するようにDockerに指示します。

The docker-compose.debug.yml そしてその docker-compose.yml DockerComposeがアプリを実行するために使用します。 Goのデバッグはより複雑であるため、デバッグファイルには追加の入力が必要になるため、これらはそれほど違いはありません。

The Dockerfile ただし、ここが最も興味深いビットです。の最後の2行 build stage コメントアウトされ、追加されます RUN go install -v ./...

# RUN go-wrapper download   # "go get -d -v ./..."
# RUN go-wrapper install    # "go install -v ./..."
RUN go install -v ./...

これが最終的なDockerファイルです。

#build stage
FROM golang:alpine AS builder
WORKDIR /go/src/app
COPY . .
RUN apk add --no-cache git
# RUN go-wrapper download   # "go get -d -v ./..."
# RUN go-wrapper install    # "go install -v ./..."
RUN go install -v ./...

#final stage
FROM alpine:latest
RUN apk --no-cache add ca-certificates
COPY --from=builder /go/bin/app /app
ENTRYPOINT ./app
LABEL Name=docker-go Version=0.0.1
EXPOSE 9000

このタイプのDockerfileパターンはマルチステージビルドと呼ばれ、その主な利点はDockerイメージの最適化です。これは、コンパイルされた言語で主に役立ちます。ほとんどの場合、コンパイルされたアプリを実行するためにコンパイルツールは必要ありません。 Goは良い例です。

簡単に言うと、Dockerビルドの一部を使用してアプリをコンパイルし、コンパイルされたバイナリをより軽いDockerイメージにコピーして、そこから実行します。

次に、イメージを作成する必要があります。コマンドパレットを開き、入力します docker-build、選択する Docker: Build Image を押して Enter.

Dockerfileを選択し、デフォルトを選択したままにして、を押すように求められます。 Enter.

最後に、画像タグを選択するように求められます。デフォルトのままにします docker-go:latest を押して Enter. 統合ターミナルにビルドログが表示されます。

最後に、コンテナを実行する必要があります。コマンドパレットを開き、入力します docker run. 選択する Docker: Run を押して Enter. 画像を選択するように求められます。選択する docker-go:latest. 統合ターミナルにログが表示されます。以前と同様に、左側のペインで[Docker]セクションを選択してコンテナーを実行することもでき、[コンテナー]で[ docker-go、実行をクリックして右クリックします。その後、同じように表示されます docker run ログ。

実行中のDockerコンテナにはバイナリしか含まれていないため、コンテナセクションでシェルをアタッチできます。入力できます ls 統合ターミナルの接続されたシェルに、次のバイナリファイルが表示されます。 app、Dockerfileに対応します。

その他の機能

最後に、VSCodeDockerプラグインに付属するその他の便利な機能について説明します。

Dockerによるイメージの検査：これにより、ビルドされたイメージを検査し、JSONファイルで詳細を確認できます。

目的の画像を選択してコンテキストメニューを開き、画像の検査を選択します。詳細が記載されたJSONファイルが開きます。

コンテナログの表示：これは、実行中のコンテナのコンテキストメニューにもあります。実行中のNode.jsコンテナを使用しますログは統合ターミナルに表示されます。

レジストリ：Dockerレジストリにログインして、ビルドおよびプッシュしたイメージを確認できます。

システムプルーニング：このオプションを使用すると、実行できます docker system prune、システムの未使用の画像をクリアします。 Dockerエクスプローラーのウィンドウとクロスのボタンから利用できます。

Intellisense：Dockerファイル（Dockerfile、docker-compose.yml）を自分で作成する必要がある場合は、入力時に便利なIntellisenseを取得できます。それはあなたに利用可能な画像タグさえ与えるでしょう。これは、画像名を入力してから完全なコロンを入力し、 CMD + Space.

Dockerfile Linting：Dockerfilesにエラーがあると、VS Codeに波線が表示され、その上にカーソルを合わせると、エラーが何であるかが表示されます。

VSCodeの下のproblemsタブにも表示されます。

結論

VS Code用のDockerプラグインを使用すると、コマンドの多くを自分で入力しなくても、Dockerfileをすばやくセットアップして作成し、ビルドして実行できます。

getdocs

13036