VS Code Remote, Dev Container, WSL

~14 min · remote, vscode, dev-containers, wsl

Level 0🌱 입문자

0 XP0/70 lessons0/11 achievements

0/120 XP to next level120 XP to go0% complete

같은 세션, 네이티브 IDE

Claude Code 가 VS Code 의 Remote 패밀리 — Remote-SSH, Remote-Containers, Remote-WSL — 와 통합. VS Code 가 원격에 연결됐을 때 Claude Code 가 자동으로 그 원격에 파일 경로 resolve, 거기서 터미널 명령어 run, 원격의 MCP config 사용. 코드 사는 곳과 세션이 일관.

두 통합 패턴: (a) Remote-SSH — VS Code 가 host 에 SSH, VS Code 의 터미널 열면 이미 원격에, 거기서 claude run. (b) Dev Container — Claude Code 가 postCreateCommand 통해 설치, ANTHROPIC_API_KEY 가 localEnv 통해 forward (컨테이너 소스에 X).

WSL2 가 세 번째 target: WSL distro 안에 Claude Code 설치, Remote-WSL 로 VS Code 연결, 같은 워크플로우. 경로 변환 자동.

Code

Dev Container with Claude Code·json

// .devcontainer/devcontainer.json
{
  "name": "My Dev Container",
  "image": "mcr.microsoft.com/devcontainers/typescript-node:20",
  "postCreateCommand": "npm install -g @anthropic-ai/claude-code",
  "remoteEnv": {
    "ANTHROPIC_API_KEY": "${localEnv:ANTHROPIC_API_KEY}"
  },
  "customizations": {
    "vscode": {
      "extensions": ["anthropic.claude-code"]
    }
  }
}

Multi-root workspace + Remote·json

// myproject.code-workspace
{
  "folders": [
    { "path": "/home/ubuntu/backend" },
    { "path": "/home/ubuntu/frontend" },
    { "path": "/home/ubuntu/shared-lib" }
  ],
  "settings": {
    "claude.remote.includeAllRoots": true,
    "claude.remote.compactBeforeHandoff": true,
    "claude.remote.preferSSHConfig": true
  }
}

External links

Exercise

repo 의 .devcontainer/devcontainer.json 만들어 — postCreateCommand 로 Claude Code 설치, localEnv 로 API key forward. 컨테이너에서 repo 다시 열어. claude 안에서 실행. 키가 파일에 없이 작동 확인.

Progress

Progress is local-only — sign in to sync across devices.

← PreviousSSH Direct — 항상 작동하는 setup Next →Zero-Trust 보안 모델

이 페이지에서 버그를 발견하셨거나 피드백이 있으세요?문제 신고

🔔 답글 알림 (로그인 필요)

로그인 — 댓글을 남기려면 로그인해 주세요.

아직 댓글이 없어요. 첫 댓글을 남겨보세요.