Dev Containers 実践ガイド：Hugo ＋ 自律 AI エージェントを安全に走らせるコンテナ環境設計

1
2
3
4
5
6

[ 課題の構造 ]
1. 人間の課題: 複雑なツールチェーンによる「私のマシンでは動かない」問題
2. AI の課題 : フル権限を与えられないことによる「確認待ちの多発（自律性の停止）」
       │
       ▼ (解決策)
[ Dev Containers による物理サンドボックス化 ]

1
2
3
4

.devcontainer/
├── devcontainer.json   # 【必須】VS Code およびコンテナの総合定義ファイル
├── Dockerfile          # 【任意】ベースイメージのカスタマイズ定義
└── post-create.sh      # 【任意】コンテナ初回生成時に実行される初期化スクリプト

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15

+-----------------------------------------------------------------------+
| ホスト OS (macOS / Linux / Windows)                                   |
|   VS Code Client（UI 描画、キー入力、テーマ表示）                     |
+-----------------------------------------------------------------------+
                                │
                                │ (IPC / SSH 接続)
                                ▼
+-----------------------------------------------------------------------+
| Docker コンテナ (DevContainer)                                        |
|   VS Code Server（プロセス管理、ファイル監視）                        |
|   ├── Hugo Extended (Go ランタイム)                                   |
|   ├── Dart Sass (SCSS コンパイラ)                                     |
|   ├── AI エージェント (Antigravity CLI / 実行ループ)                  |
|   └── 拡張機能・デバッガ・言語サーバー (LSP)                          |
+-----------------------------------------------------------------------+

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52

{
  "name": "Hugo & AI Agent DevContainer",
  "build": {
    "context": ".",
    "dockerfile": "./Dockerfile"
  },
  "remoteUser": "vscode",

  // 1. AI エージェントの知見・セッションデータを名前付きボリュームで永続化
  "mounts": [
    "source=antigravity-cli-data,target=/home/vscode/.gemini/antigravity-cli,type=volume"
  ],

  // 2. ホスト側の環境変数（GitHub トークン等）をコンテナ内へ安全に注入
  "remoteEnv": {
    "GITHUB_TOKEN_BLOG": "${localEnv:GITHUB_TOKEN_BLOG}"
  },

  // 3. Dev Container Features による機能のモジュール追加
  "features": {
    // コンテナ内からホストの Docker デーモンを安全に操作（Docker-outside-of-Docker）
    "ghcr.io/devcontainers/features/docker-outside-of-docker:1": {
      "moby": false
    },
    // Node.js ランタイム
    "ghcr.io/devcontainers/features/node:1": {
      "version": "22"
    }
  },

  // 4. コンテナ内で自動有効化する VS Code 拡張機能
  "customizations": {
    "vscode": {
      "extensions": [
        "golang.go",
        "esbenp.prettier-vscode",
        "asciidoctor.asciidoctor-vscode",
        "GitHub.copilot"
      ],
      "settings": {
        "editor.formatOnSave": true,
        "terminal.integrated.defaultProfile.linux": "bash"
      }
    }
  },

  // 5. 初回コンテナ作成時にツールを自動セットアップ
  "postCreateCommand": "bash .devcontainer/post-create.sh",

  // 6. ポートフォワーディング（Hugo ローカルサーバー）
  "forwardPorts": [1313]
}

1
2
3

"mounts": [
  "source=antigravity-cli-data,target=/home/vscode/.gemini/antigravity-cli,type=volume"
]

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29

#!/usr/bin/env bash
set -euo pipefail

echo "=== DevContainer Post-Create Setup ==="

# 1. Hugo Extended のインストール（未導入の場合）
if ! command -v hugo >/dev/null 2>&1; then
  echo "Installing Hugo Extended..."
  CGO_ENABLED=1 go install -tags extended github.com/gohugoio/hugo@latest
fi

# 2. 記事作成ショートカット CLI の配置
mkdir -p /home/vscode/.local/bin
cat << 'EOF' > /home/vscode/.local/bin/new-post
#!/usr/bin/env bash
set -euo pipefail
SLUG="${1:-}"
if [[ -z "$SLUG" ]]; then
  echo "Usage: new-post <slug>" >&2
  exit 1
fi
YEAR=$(date +%Y)
MONTH=$(date +%m)
hugo new "posts/${YEAR}/${MONTH}/${SLUG}/index.md"
echo "Created: blog/content/posts/${YEAR}/${MONTH}/${SLUG}/index.md"
EOF
chmod +x /home/vscode/.local/bin/new-post

echo "✓ Post-Create Setup Completed Successfully."