JV

juehang/vscode-mcp-server

Developer tools

이 페이지는 AI로 자동 번역되었습니다. 기술적인 세부 사항은 원문을 확인하세요. 원문 보기

392 stars 85 forks 품질 69 트렌드 20MIT

MCP 서버는 AI 코딩을 위한 LLM에 VS Code 편집 기능을 노출하기 위해 사용됩니다

개요

Claude와 다른 MCP 클라이언트가 VS Code로 직접 코딩할 수 있게 해주는 Visual Studio Code 확장 프로그램(마켓플레이스에서 이용 가능)입니다! Serena에서 영감을 받았지만 VS Code 내장 기능을 활용합니다. 기존 코딩 에이전트인 Claude Code를 VS Code 전용 기능(심볼 검색, 문서 개요)으로 확장하기에 완벽하며, 기존 도구를 중복하지 않고도 좋습니다. 이 확장은 SSE API가 아닌 스트리밍 가능한 HTTP API를 사용한다는 점에 유의하세요. 이 확장은 셸 명령어 실행을 허용할 수 있습니다. 즉, 잠재적인 보안 위험이 있으니 신중하게 사용하시고, 사용 중인 MCP 클라이언트를 신뢰하고 포트가 어떤 위협에도 노출되지 않도록 하세요. 인증이 도움이 되겠지만, MCP 인증 사양이 아직 불안정해 현재는 구현되지 않았습니다. https://github.com/user-attachments/assets/20b87dfb-fc39-4710-a910-b9481dde1e90 1.

개요(AI 번역)

Claude와 다른 MCP 클라이언트가 VS Code로 직접 코딩할 수 있게 해주는 Visual Studio Code 확장 프로그램(마켓플레이스에서 이용 가능)입니다! Serena에서 영감을 받았지만 VS Code 내장 기능을 활용합니다. 기존 코딩 에이전트인 Claude Code를 VS Code 전용 기능(심볼 검색, 문서 개요)으로 확장하기에 완벽하며, 기존 도구를 중복하지 않고도 좋습니다. 이 확장은 SSE API가 아닌 스트리밍 가능한 HTTP API를 사용한다는 점에 유의하세요.

이 확장은 셸 명령어 실행을 허용할 수 있습니다. 즉, 잠재적인 보안 위험이 있으니 신중하게 사용하시고, 사용 중인 MCP 클라이언트를 신뢰하고 포트가 어떤 위협에도 노출되지 않도록 하세요. 인증이 도움이 되겠지만, MCP 인증 사양이 아직 불안정해 현재는 구현되지 않았습니다.

PR 여러분 환영합니다!

데모 비디오

https://github.com/user-attachments/assets/20b87dfb-fc39-4710-a910-b9481dde1e90

설치

  1. 마켓플레이스에서 확장 프로그램을 설치하거나 이 저장소를 복제한 후 npm install와 npm run compile를 실행하여 구축하세요.

Claude 데스크탑 구성

Claude Desktop은 이 확장 기능을 MCP 서버로 사용하도록 설정할 수 있습니다.

이 페이지는 AI로 자동 번역되었습니다. 기술적인 세부 사항은 원문을 확인하세요.

README

원문 README의 일부입니다. 원문 보기.

VS Code MCP Server

A Visual Studio Code extension (available on the Marketplace) that allows Claude and other MCP clients to code directly in VS Code! Inspired by Serena, but using VS Code’s built-in capabilities. Perfect for extending existing coding agents like Claude Code with VS Code-specific capabilities (symbol search, document outlines) without duplicating tools they already have. Note that this extension uses the streamable HTTP API, not the SSE API.

This extension can allow for execution of shell commands. This means that there is a potential security risk, so use with caution, and ensure that you trust the MCP client that you are using and that the port is not exposed to anything. Authentication would help, but as the MCP authentication spec is still in flux, this has not been implemented for now.

PRs are welcome!

Demo Video

https://github.com/user-attachments/assets/20b87dfb-fc39-4710-a910-b9481dde1e90

Installation

  1. Install the extension from the Marketplace or clone this repository and run npm install and npm run compile to build it.

Claude Desktop Configuration

Claude Desktop can be configured to use this extension as an MCP server. To do this, your claude_desktop_config.json file should look like this:

{
  "mcpServers": {
    "vscode-mcp-server": {
        "command": "npx",
        "args": ["mcp-remote@next", "http://localhost:3000/mcp"]
    }

  }
}

I also like to use this extension in a Claude project, as it allows me to specify additional instructions for Claude. I find the following prompt to work well:

You are working on an existing codebase, which you can access using your tools. These code tools interact with a VS Code workspace.

WORKFLOW ESSENTIALS:
1. Always start exploration with list_files_code on root directory (.) first
2. CRITICAL: Run get_diagnostics_code after EVERY set of code changes before completing tasks
3. For small edits (≤10 lines): use replace_lines_code with exact original content
4. For large changes, new files, or uncertain content: use create_file_code with overwrite=true

EXPLORATION STRATEGY:
- Start: list_files_code with path='.' (never recursive on root)
- Understand structure: read key files like package.json, README, main entry points
- Find symbols: use search_symbols_code for functions/classes, get_document_symbols_code for file overviews
- Before editing: read_file_code the target file to understand current content

EDITING BEST PRACTICES:
- Small modifications: replace_lines_code (requires exact original content match)
- If replace_lines_code fails: read_file_code the target lines, then retry with correct content
- Large changes: create_file_code with overwrite=true is more reliable
- After any changes: get_diagnostics_code to check for errors
GitHub에서 전체 README 보기

설치

npx mcp-remote@next http://localhost:3000/mcp
MCP 초보자라면? mcpskill.org 가이드부터 시작하세요 →