カテゴリー
Linux

Visual Studio Code Remote Container を利用してもしなくても (Vim とかと docker-compose コマンド) 最強のローカル環境とデプロイ用のコンテナ化環境を作る方法、 Vue.js を例に添えて。

まとめ

作ったもの

docker-compose コマンドだけで環境をうまく切り替える方法

  • docker-compose -f オプションを使うことで、使用する YAML ファイルを取捨選択できるようになった。これを利用して、開発環境用ではボリューム共有を使い、サーバ環境用では別のサービスを追加する、といったことが可能になる。
  • docker-compose -f オプションで毎回 YAML ファイルを指定するのはとても手間がかかるが、解決することができる。Compose の設定に用いられる環境変数のデフォルト値を .env という 環境ファイル で行うことができる。このファイルに COMPOSE_FILE という CLI 変数 を定義し、その値に使用する YAML ファイルを指定することで -f オプションを省略することができる。
  • Dockerfile のマルチステージビルド を使うことによって、複数の環境を一つの Dockerfile で表現することができる。

Visual Studio Code で開発環境コンテナも使う方法

  • Visual Studio Code の Remote – Containers – Visual Studio Marketplace 拡張機能で実現する。
  • コマンドパレットから "Remote-Containers: Add Development Container Configuration File…" を選んで設定ファイルを自動生成するのが楽。
    • .devcontainer/devcontainer.json が独自の設定ファイル。 .devcontainer/docker-compose.yml はただの Docker Compose ファイル。
    • .devcontainer/devcontainer.json.devcontainer/docker-compose.yml の難しい箇所は本投稿の続きに記載した。