VS Code 확장 프로그램 (베타)

베타로 제공되는 VS Code 확장 프로그램을 사용하면 IDE에 직접 통합된 네이티브 그래픽 인터페이스를 통해 Claude의 변경 사항을 실시간으로 볼 수 있습니다. VS Code 확장 프로그램은 터미널보다 시각적 인터페이스를 선호하는 사용자가 Claude Code에 더 쉽게 접근하고 상호작용할 수 있게 해줍니다.

기능

VS Code 확장 프로그램은 다음을 제공합니다:
  • 네이티브 IDE 경험: Spark 아이콘을 통해 접근할 수 있는 전용 Claude Code 사이드바 패널
  • 편집 기능이 있는 계획 모드: Claude의 계획을 수락하기 전에 검토하고 편집
  • 자동 수락 편집 모드: Claude의 변경 사항이 만들어지는 대로 자동으로 적용
  • 파일 관리: @-멘션 파일 또는 시스템 파일 선택기를 사용하여 파일과 이미지 첨부
  • MCP 서버 사용: CLI를 통해 구성된 Model Context Protocol 서버 사용
  • 대화 기록: 과거 대화에 쉽게 접근
  • 다중 세션: 여러 Claude Code 세션을 동시에 실행
  • 키보드 단축키: CLI의 대부분 단축키 지원
  • 슬래시 명령: 확장 프로그램에서 직접 대부분의 CLI 슬래시 명령에 접근

요구사항

  • VS Code 1.98.0 이상

설치

Visual Studio Code Extension Marketplace에서 확장 프로그램을 다운로드하고 설치하세요.

업데이트

VS Code 확장 프로그램을 업데이트하려면:
  1. Cmd+Shift+P (Mac) 또는 Ctrl+Shift+P (Windows/Linux)로 VS Code 명령 팔레트를 엽니다
  2. “Claude Code: Update”를 검색합니다
  3. 명령을 선택하여 최신 버전으로 업데이트합니다

작동 방식

설치가 완료되면 VS Code 인터페이스를 통해 Claude Code를 사용할 수 있습니다:
  1. 편집기의 사이드바에서 Spark 아이콘을 클릭하여 Claude Code 패널을 엽니다
  2. 터미널에서와 같은 방식으로 Claude Code에 프롬프트를 입력합니다
  3. Claude가 코드를 분석하고 변경 사항을 제안하는 것을 지켜봅니다
  4. 인터페이스에서 직접 편집 내용을 검토하고 수락합니다
    • : 인라인 diff를 보려면 사이드바를 더 넓게 드래그한 다음 클릭하여 전체 세부 정보를 확장하세요

아직 구현되지 않은 기능

다음 기능들은 VS Code 확장 프로그램에서 아직 사용할 수 없습니다:
  • 전체 MCP 서버 구성: 먼저 CLI를 통해 MCP 서버를 구성해야 하며, 그러면 확장 프로그램이 이를 사용합니다
  • 서브에이전트 구성: VS Code에서 사용하려면 CLI를 통해 서브에이전트를 구성하세요
  • 체크포인트: 특정 지점에서 대화 상태 저장 및 복원
  • 고급 단축키:
    • 메모리에 추가하는 # 단축키
    • bash 명령을 직접 실행하는 ! 단축키
  • 탭 완성: 탭 키를 사용한 파일 경로 완성
향후 업데이트에서 이러한 기능들을 추가하기 위해 작업하고 있습니다.

보안 고려사항

Claude Code가 자동 편집 권한이 활성화된 상태로 VS Code에서 실행될 때, IDE에서 자동으로 실행될 수 있는 IDE 구성 파일을 수정할 수 있습니다. 이는 자동 편집 모드에서 Claude Code를 실행할 때의 위험을 증가시킬 수 있으며 bash 실행에 대한 Claude Code의 권한 프롬프트를 우회할 수 있게 할 수 있습니다. VS Code에서 실행할 때 다음을 고려하세요:
  • 신뢰할 수 없는 작업공간에 대해 VS Code 제한 모드 활성화
  • 편집에 대한 수동 승인 모드 사용
  • Claude가 신뢰할 수 있는 프롬프트에서만 사용되도록 각별한 주의

레거시 CLI 통합

우리가 출시한 첫 번째 VS Code 통합은 터미널에서 실행되는 Claude Code가 IDE와 상호작용할 수 있게 해줍니다. 선택 컨텍스트 공유(현재 선택/탭이 자동으로 Claude Code와 공유됨), 터미널 대신 IDE에서 diff 보기, 파일 참조 단축키(Mac에서 Cmd+Option+K 또는 Windows/Linux에서 Alt+Ctrl+K를 사용하여 @File#L1-99와 같은 파일 참조 삽입), 자동 진단 공유(린트 및 구문 오류)를 제공합니다. 레거시 통합은 VS Code의 통합 터미널에서 claude를 실행할 때 자동으로 설치됩니다. 터미널에서 claude를 실행하기만 하면 모든 기능이 활성화됩니다. 외부 터미널의 경우 /ide 명령을 사용하여 Claude Code를 VS Code 인스턴스에 연결하세요. 구성하려면 claude를 실행하고 /config를 입력한 다음 diff 도구를 auto로 설정하여 자동 IDE 감지를 활성화하세요. 확장 프로그램과 CLI 통합 모두 Visual Studio Code, Cursor, Windsurf, VSCodium과 함께 작동합니다.

문제 해결

확장 프로그램이 설치되지 않음

  • 호환되는 VS Code 버전(1.85.0 이상)이 있는지 확인하세요
  • VS Code에 확장 프로그램 설치 권한이 있는지 확인하세요
  • 마켓플레이스 웹사이트에서 직접 설치해 보세요

레거시 통합이 작동하지 않음

  • VS Code의 통합 터미널에서 Claude Code를 실행하고 있는지 확인하세요
  • IDE 변형에 대한 CLI가 설치되어 있는지 확인하세요:
    • VS Code: code 명령이 사용 가능해야 함
    • Cursor: cursor 명령이 사용 가능해야 함
    • Windsurf: windsurf 명령이 사용 가능해야 함
    • VSCodium: codium 명령이 사용 가능해야 함
  • 명령이 설치되지 않은 경우:
    1. Cmd+Shift+P (Mac) 또는 Ctrl+Shift+P (Windows/Linux)로 명령 팔레트를 엽니다
    2. “Shell Command: Install ‘code’ command in PATH”를 검색합니다 (또는 IDE에 해당하는 명령)
추가 도움이 필요하면 문제 해결 가이드를 참조하세요.