Dockerコンテナー内でのコードの開発またはデバッグは、注意が必要な場合があります。通常はコンテナに接続し、シェルユーティリティを使用してファイルを編集します。 Visual StudioCodeのRemoteContainers拡張機能を使用すると、コンテナー内のフォルダーを開くことができるため、コードエディターでフォルダーを操作できます。
リモート開発は、WindowsとmacOSの場合はDocker Desktop 2.0以降、Linuxの場合はDockerEngine18.06以降で動作します。 Windows 10 Homeを使用している場合は、2020年4月の更新、Docker Desktop 2.3、およびLinux用のWindowsサブシステムがインストールされている必要があります。
コンテナー側では、VSCodeはx64コンテナーとARMコンテナーの両方と互換性があります。 Alpine、Debian、Ubuntu、CentOS、RHELオペレーティングシステムを使用できます。ベースイメージがそのままでは機能しない場合は、その中に追加のパッケージをインストールして接続を完了することができるはずです。
VS Codeを起動し、Ctrl + Shift + Pを押して、「extensions」を検索します。 「拡張機能のインストール」項目を選択して、サイドバーを表示します。拡張機能ペインで、「リモート–コンテナ」を検索し、一致するアイテムをインストールします。
拡張機能がインストールされると、ステータスバーの左下に新しい緑色のボタンが表示されます。これをクリックすると、使用可能なリモートコマンドが事前に入力されたコマンドパレットが表示されます。マウスの使用を避けたい場合は、Ctrl + Shift+Pを押して「リモート」と入力してコマンドを見つけることもできます。拡張機能は、ウェルカムページやフォルダのオープニングペインなど、UIの他の領域にも表示されます。
最初のDockerizedフォルダーを開くには、コマンドリストを表示し、[実行中のコンテナーにアタッチ]を選択します。コンテナが信頼できないコードを実行する可能性があるという警告を確認する必要があります。 VS Codeワークスペースファイルを含む悪意のあるコンテナーはシステムを危険にさらす可能性があるため、信頼できるイメージから作成されたコンテナーにのみアタッチする必要があります。
VS Codeは、システムで実行されているDockerコンテナーのリストを表示します。接続するコンテナを選択します。新しいウィンドウが起動します。 VS Codeがリモートサーバーコンポーネントをコンテナーにインストールしている間、起動に数秒かかる場合があります。ステータスバーの左下にアクティブなコンテナが表示されます。
ウィンドウの準備ができたら、作業を開始できます。左側のペインの[フォルダを開く]ボタンをクリックして、ファイルピッカープロンプトを表示します。これにより、ファイルシステムが内に表示されます。 コンテナ。開きたいディレクトリに移動して、[OK]を押します。
サイドバーが更新され、選択したディレクトリの内容が表示されます。いずれかのファイルをクリックして、VSCodeEditorで開きます。ファイルを手動でコピーしたり、作業ディレクトリのバインドマウントを設定したりせずに、コンテナ内で変更を加えることができるようになりました。これにより、Docker化された開発環境を使用したり、誤動作しているコンテナをデバッグしたりする際の効率が最大化されます。
IntelliSenseコード補完とそのデバッグツールキットを含む、VSCodeの全機能セットが利用可能です。コンソールやターミナルなどのペインは、コンテナの入力ストリームと出力ストリームに接続されます。
どのように機能しますか？
統合について最初に認識すべきことは、VSCodeがコンテナーのファイルシステムを変更することです。接続するコンテナにサーバーがインストールされ、エディタークライアントに情報がフィードバックされます。
サーバーはファイルシステムを監視し、ファイルを読み取り、コンテナー内でプロセスを起動します。これにより、VSCodeのデバッガーなどの機能が強化されます。エディターはサーバーにソースを実行するように要求し、コンテナー内で実行されているコードを検査できるようにします。
同様に、VSCodeは他の拡張機能のコピーをコンテナー内にインストールします。これにより、コンテナファイルシステムへのフルアクセスが保証されるため、ローカルフォルダと比較して矛盾することなく動作します。最終的には、ホストとコンテナー全体に分散していても、透過的に動作する本格的なエディターエクスペリエンスが実現します。環境のサイズによっては、最初の実行のセットアップに少し時間がかかる場合がありますが、コンテナサーバーは後で使用するためにキャッシュされます。
リモートシステムでは、既存のコンテナでファイルを開くだけでなく、作業環境をカプセル化する開発コンテナを定義できます。このようなコンテナには、アプリケーションをローカルで開発する前にインストールするすべてのソフトウェア依存関係が含まれている必要があります。
開発コンテナを使用している場合は、作業ディレクトリをバインドマウントするか、分離ボリュームを使用できます。後者のオプションは、ファイルシステムの汚染を回避し、Dockerにネイティブであるため、パフォーマンスが向上します。
開発コンテナは、.devcontainer/devcontainer.jsonから作成されます ファイル。これらは、開発環境を起動するDockerとVisualStudioの構成について説明しています。
{
"image": "mcr.microsoft.com/vscode/devcontainers/javascript-node:16",
"extensions": "EditorConfig.EditorConfig",
"forwardPorts": [3000]
}
devcontainer.json 上記のファイルは、MicrosoftのNode.jsテンプレートを使用する開発コンテナを設定します。 EditorConfig VS Code拡張機能が有効になり、.editorconfigのサポートが追加されます 作業ディレクトリ内のファイル。次に、ポート3000がホストからコンテナにマッピングされます。
開発コンテナファイルは、他のいくつかのオプションもサポートしています。 VS Code settings.jsonを設定できます 値を指定し、コンテナー内で実行するコマンドを追加し、VSCodeサーバーを実行するユーザーを定義します。
コンテナ構成ファイルを自分で作成したくない場合は、リモートコンテナ：開発構成ファイルの追加 コマンドはプロジェクトに自動的に追加します。事前に構成されたテンプレートのリストから選択して、後でカスタマイズすることができます。
devcontainer.jsonを取得したら プロジェクト内のファイルで、 Remote-Containers：Rebuild Containerを実行します コマンドパレットからのコマンド。これにより、指定された構成を使用してコンテナーイメージが構築されます。ビルドが完了したら、 Remote-Containers：Reopen Folder in Containerを実行します 新しい開発コンテナ内で現在のローカルディレクトリを開きます。
Gitリポジトリを使用している場合は、通常、リポジトリをコンテナに直接複製する方が簡単です。 リモートコンテナ：コンテナボリューム内のリポジトリのクローン コマンドはGitURLを受け入れてクローンを作成します。新しいボリュームを作成し、それを開発コンテナインスタンスにアタッチします。これにより、ローカルファイルシステムにクローンを作成せずにGitリポジトリで作業できるため、不要な汚染を回避できます。 VS Codeは、ローカルのGitクレデンシャルをコンテナーと自動的に共有します。
Remote – Containers拡張機能には、コンテナエクスペリエンスを構成できるいくつかの設定が付属しています。 リモートコンテナ：リモートコンテナの設定で見つけることができます コマンド。
設定の最初のコレクションはドットファイルに関するものです。ドットファイルとは、ドット（.）で始まる構成ファイルを指します。 ）。リモートコンテナは、ドットファイルのGitリポジトリを新しいコンテナに自動的に複製できるため、通常の設定で実行できます。
dotfilesリポジトリのURLをRepositoryに追加します 設定。リポジトリはTarget Pathに複製されます パス。デフォルトは~/dotfilesです。 。リポジトリのクローンを作成した後にコマンドを実行する場合は、Install Commandとして指定します。 。
Remote-Containersは、デフォルトでdockerを使用します コンテナコマンドを実行するバイナリとして。これは、Docker Pathを使用してDockerCLI互換のバイナリに変更できます。 設定。 Podmanを使用している場合は、podmanを指定します この値を使用すると、VSCodeを使用してコンテナーを操作できるようになります。
Default Extensionsでデフォルトのリモート拡張機能を設定できます 見出し。 「アイテムの追加」をクリックして、すべてのコンテナに追加する拡張子を選択します。これにより、devcontainer.jsonにリストされていない場合でも、必須の拡張機能をグローバルに利用できるようになります。 ファイル。
設定の最後のグループはGit構成に関係します。 「GitConfigのコピー」がチェックされている場合、ローカルの.gitconfig ファイルは自動的にコンテナに自動的にコピーされます。これを有効にすると、コミットがすでにローカルで使用しているユーザーの詳細に正しく関連付けられます。
「Gitクレデンシャルヘルパーの構成場所」設定は、新しいGitクレデンシャルが書き込まれる構成ファイルを制御します。ローカルのユーザーごとのファイルから、~/.gitconfigを選択できます。 、またはグローバルシステムの場所、/etc/gitconfig 。
Visual StudioCodeのRemote– Containers拡張機能を使用すると、Dockerコンテナー内のファイルとフォルダーを編集できます。 IntelliSense、ディレクトリインデックス作成、デバッグ、拡張機能などのVSCodeエディター機能とシームレスに連携します。内部的には、VS Codeはコンテナー内で開発サーバーを起動するため、ツールは作業中のファイルシステムに完全にアクセスできます。
Docker化された開発環境とオンザフライのコンテナが上位の候補を編集するなど、この機能にはいくつかのユースケースが考えられます。 アイデア コンテナを使用して開発を体系化する方法は以前からありましたが、VS Codeは、Dockerをネイティブに理解するIDEエクスペリエンスを提供することで、開始をはるかに簡単にします。
開発者がシステムで作業するために必要なすべてのもの（プログラミング言語、依存関係、便利なツール）を提供するDockerイメージを準備できます。開発者はコンテナを起動し、VS Codeからコンテナに接続し、自分のマシンに何も（コードを除く）インストールせずに作業を進めます。依存関係にパッチを適用する必要がある場合は、共有Dockerイメージを更新し、開発者に新しいタグをプルさせるだけです。