0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

備忘録 VSCode 拡張機能 Dev Containers

Last updated at Posted at 2025-09-12

はじめに

久しぶりにDev Containersを使ったところ、操作方法を忘れていたので備忘録としてまとめます。

なぜDev Containersを使おうと思ったか

コンテナ外と中で環境差が出る問題があります。
ホスト環境は汚してくないためpip install は Dockerfile 内で行っているので、ホスト環境には反映されません。
->ホスト環境でコードを開くと下図のようにimportエラーになります。
そのためコンテナ内で直接開発したい事があります。

requirements.txt
fastapi==0.115.0
uvicorn[standard]==0.30.6
SQLAlchemy==2.0.34
psycopg2-binary==2.9.9
pydantic==2.9.2
python-dotenv==1.0.1
COPY requirements.txt .
RUN pip install --no-cache-dir -r requirements.txt

1.png

Dev Containersとは

VSCodeのRemote Development系拡張のひとつです。
Dockerコンテナ内をVSCodeで操作できます。

前提

docker compose upコマンド等でコンテナが立ち上がっている状態を前提とします。

Dev Containers 拡張のインストール

VSCode拡張機能タブからDev Containersで検索してインストールしてください。
下図アイコンです。
2.png

操作方法 コンテナの指定

コンテナ内に入る操作方法は複数あるのでその中でシンプルなものを記します

左下からのアイコンからコンテナに入る方法

左下の緑色のアイコンをクリックすると上のメニューが開くので「実行中のコンテナーにアタッチ」を選択します。
3.png
4.png

立ち上がっているコンテナ一覧が表示されるので入りたいコンテナを選択します。
image.png

左下のアイコンを使わない方法

Ctrl+Shift+Pで「Attach to Running Container」と打ち込み
Dev Containers: Attach to Running Containerを選択することでも、立ち上がっているコンテナ一覧を表示することは可能です。
6.png

操作方法 ディレクトリの指定

メニューの「ファイル」 -> 「フォルダを開く」でコンテナ内のディレクトリを指定するメニューが開きます。
ここではマウントしたディレクトリを指定します。
7.png
ファイルを開くとコンテナ内のためにライブラリがインストールされており、importエラーが出ていないことが確認できます。
5.png

まとめ

Dev Containersの操作方法をまとめました。

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?