Pular para o conteúdo principal
Editor VS Code com o painel de extensão Claude Code aberto no lado direito, mostrando uma conversa com Claude A extensão VS Code fornece uma interface gráfica nativa para Claude Code, integrada diretamente ao seu IDE. Esta é a forma recomendada de usar Claude Code no VS Code. Com a extensão, você pode revisar e editar os planos do Claude antes de aceitá-los, aceitar automaticamente edições conforme são feitas, @-mention arquivos com intervalos de linhas específicas da sua seleção, acessar histórico de conversas e abrir múltiplas conversas em abas separadas ou janelas.

​
Pré-requisitos

  • VS Code 1.98.0 ou superior
  • Uma conta Anthropic (você fará login quando abrir a extensão pela primeira vez). Se você estiver usando um provedor de terceiros como Amazon Bedrock ou Google Vertex AI, consulte Use third-party providers em vez disso.
A extensão inclui o CLI (interface de linha de comando), que você pode acessar do terminal integrado do VS Code para recursos avançados. Consulte VS Code extension vs. Claude Code CLI para detalhes.

​
Instale a extensão

Clique no link do seu IDE para instalar diretamente: Ou no VS Code, pressione Cmd+Shift+X (Mac) ou Ctrl+Shift+X (Windows/Linux) para abrir a visualização de Extensões, procure por “Claude Code” e clique em Instalar.
Se a extensão não aparecer após a instalação, reinicie o VS Code ou execute “Developer: Reload Window” na Paleta de Comandos.

​
Comece

Após a instalação, você pode começar a usar Claude Code através da interface VS Code:
1

Abra o painel Claude Code

Em todo o VS Code, o ícone Spark indica Claude Code: Ícone SparkA forma mais rápida de abrir Claude é clicar no ícone Spark na Barra de Ferramentas do Editor (canto superior direito do editor). O ícone só aparece quando você tem um arquivo aberto.Editor VS Code mostrando o ícone Spark na Barra de Ferramentas do EditorOutras formas de abrir Claude Code:
  • Paleta de Comandos: Cmd+Shift+P (Mac) ou Ctrl+Shift+P (Windows/Linux), digite “Claude Code” e selecione uma opção como “Open in New Tab”
  • Barra de Status: Clique em ✱ Claude Code no canto inferior direito da janela. Isso funciona mesmo quando nenhum arquivo está aberto.
Quando você abre o painel pela primeira vez, uma lista de verificação Learn Claude Code aparece. Trabalhe em cada item clicando em Show me ou descarte-a com o X. Para reabri-la mais tarde, desmarque Hide Onboarding nas configurações do VS Code em Extensions → Claude Code.Você pode arrastar o painel Claude para reposicioná-lo em qualquer lugar do VS Code. Consulte Customize your workflow para detalhes.
2

Envie um prompt

Peça ao Claude para ajudar com seu código ou arquivos, seja explicando como algo funciona, depurando um problema ou fazendo alterações.
Claude vê automaticamente seu texto selecionado. Pressione Option+K (Mac) / Alt+K (Windows/Linux) para também inserir uma referência @-mention (como @file.ts#5-10) em seu prompt.
Aqui está um exemplo de pergunta sobre uma linha específica em um arquivo:Editor VS Code com as linhas 2-3 selecionadas em um arquivo Python, e o painel Claude Code mostrando uma pergunta sobre essas linhas com uma referência @-mention
3

Revise as alterações

Quando Claude quer editar um arquivo, ele mostra uma comparação lado a lado do original e das alterações propostas, depois pede permissão. Você pode aceitar, rejeitar ou dizer ao Claude o que fazer em vez disso.VS Code mostrando um diff das alterações propostas pelo Claude com um prompt de permissão perguntando se deve fazer a edição
Para mais ideias sobre o que você pode fazer com Claude Code, consulte Common workflows.
Execute “Claude Code: Open Walkthrough” na Paleta de Comandos para um tour guiado dos conceitos básicos.

​
Use a caixa de prompt

A caixa de prompt suporta vários recursos:
  • Modos de permissão: Clique no indicador de modo na parte inferior da caixa de prompt para alternar modos. No modo normal, Claude pede permissão antes de cada ação. No Plan Mode, Claude descreve o que fará e aguarda aprovação antes de fazer alterações. No modo de aceitar automaticamente, Claude faz edições sem perguntar. Defina o padrão nas configurações do VS Code em claudeCode.initialPermissionMode.
  • Menu de comando: Clique em / ou digite / para abrir o menu de comando. As opções incluem anexar arquivos, alternar modelos, alternar pensamento estendido e visualizar uso de plano (/usage). A seção Personalizar fornece acesso a MCP servers, hooks, memória, permissões e plugins. Itens com um ícone de terminal abrem no terminal integrado.
  • Indicador de contexto: A caixa de prompt mostra quanto da context window do Claude você está usando. Claude compacta automaticamente quando necessário, ou você pode executar /compact manualmente.
  • Pensamento estendido: Permite que Claude gaste mais tempo raciocinando sobre problemas complexos. Alterne-o via menu de comando (/). Consulte Extended thinking para detalhes.
  • Entrada multi-linha: Pressione Shift+Enter para adicionar uma nova linha sem enviar. Isso também funciona na entrada de texto livre “Other” de diálogos de pergunta.

​
Referencie arquivos e pastas

Use @-mentions para dar ao Claude contexto sobre arquivos ou pastas específicas. Quando você digita @ seguido de um nome de arquivo ou pasta, Claude lê esse conteúdo e pode responder perguntas sobre ele ou fazer alterações nele. Claude Code suporta correspondência difusa, então você pode digitar nomes parciais para encontrar o que precisa: 
> Explain the logic in @auth (fuzzy matches auth.js, AuthService.ts, etc.)
> What's in @src/components/ (include a trailing slash for folders)
Para PDFs grandes, você pode pedir ao Claude para ler páginas específicas em vez do arquivo inteiro: uma única página, um intervalo como páginas 1-10 ou um intervalo aberto como página 3 em diante. Quando você seleciona texto no editor, Claude pode ver seu código destacado automaticamente. O rodapé da caixa de prompt mostra quantas linhas estão selecionadas. Pressione Option+K (Mac) / Alt+K (Windows/Linux) para inserir um @-mention com o caminho do arquivo e números de linha (por exemplo, @app.ts#5-10). Clique no indicador de seleção para alternar se Claude pode ver seu texto destacado - o ícone de barra de olho significa que a seleção está oculta do Claude. Você também pode manter Shift pressionado enquanto arrasta arquivos para a caixa de prompt para adicioná-los como anexos. Clique no X em qualquer anexo para removê-lo do contexto.

​
Retome conversas passadas

Clique no menu suspenso na parte superior do painel Claude Code para acessar seu histórico de conversas. Você pode pesquisar por palavra-chave ou navegar por tempo (Hoje, Ontem, Últimos 7 dias, etc.). Clique em qualquer conversa para retomá-la com o histórico completo de mensagens. Para mais sobre retomar sessões, consulte Common workflows.

​
Retome sessões remotas do Claude.ai

Se você usar Claude Code on the web, você pode retomar essas sessões remotas diretamente no VS Code. Isso requer fazer login com Claude.ai Subscription, não Anthropic Console.
1

Abra Conversas Passadas

Clique no menu suspenso Past Conversations na parte superior do painel Claude Code.
2

Selecione a aba Remote

O diálogo mostra duas abas: Local e Remote. Clique em Remote para ver sessões do claude.ai.
3

Selecione uma sessão para retomar

Navegue ou pesquise suas sessões remotas. Clique em qualquer sessão para baixá-la e continuar a conversa localmente.
Apenas sessões web iniciadas com um repositório GitHub aparecem na aba Remote. Retomar carrega o histórico de conversas localmente; as alterações não são sincronizadas de volta para claude.ai.

​
Customize seu fluxo de trabalho

Depois de estar funcionando, você pode reposicionar o painel Claude, executar múltiplas sessões ou alternar para modo terminal.

​
Escolha onde Claude fica

Você pode arrastar o painel Claude para reposicioná-lo em qualquer lugar do VS Code. Pegue a aba ou barra de título do painel e arraste para:
  • Barra lateral secundária: O lado direito da janela. Mantém Claude visível enquanto você codifica.
  • Barra lateral primária: A barra lateral esquerda com ícones para Explorer, Search, etc.
  • Área do editor: Abre Claude como uma aba ao lado de seus arquivos. Útil para tarefas secundárias.
Use a barra lateral para sua sessão principal do Claude e abra abas adicionais para tarefas secundárias. Claude lembra sua localização preferida. Observe que o ícone Spark só aparece na Activity Bar quando o painel Claude está encaixado à esquerda. Como Claude é padrão no lado direito, use o ícone da Barra de Ferramentas do Editor para abrir Claude.

​
Execute múltiplas conversas

Use Open in New Tab ou Open in New Window na Paleta de Comandos para iniciar conversas adicionais. Cada conversa mantém seu próprio histórico e contexto, permitindo que você trabalhe em diferentes tarefas em paralelo. Ao usar abas, um pequeno ponto colorido no ícone spark indica status: azul significa que uma solicitação de permissão está pendente, laranja significa que Claude terminou enquanto a aba estava oculta.

​
Alterne para modo terminal

Por padrão, a extensão abre um painel de chat gráfico. Se você preferir a interface estilo CLI, abra a Use Terminal setting e marque a caixa. Você também pode abrir as configurações do VS Code (Cmd+, no Mac ou Ctrl+, no Windows/Linux), ir para Extensions → Claude Code e marcar Use Terminal.

​
Gerencie plugins

A extensão VS Code inclui uma interface gráfica para instalar e gerenciar plugins. Digite /plugins na caixa de prompt para abrir a interface Manage plugins.

​
Instale plugins

O diálogo de plugin mostra duas abas: Plugins e Marketplaces. Na aba Plugins:
  • Plugins instalados aparecem no topo com interruptores de alternância para habilitá-los ou desabilitá-los
  • Plugins disponíveis de seus marketplaces configurados aparecem abaixo
  • Pesquise para filtrar plugins por nome ou descrição
  • Clique em Install em qualquer plugin disponível
Quando você instala um plugin, escolha o escopo de instalação:
  • Install for you: Disponível em todos os seus projetos (escopo de usuário)
  • Install for this project: Compartilhado com colaboradores do projeto (escopo de projeto)
  • Install locally: Apenas para você, apenas neste repositório (escopo local)

​
Gerencie marketplaces

Alterne para a aba Marketplaces para adicionar ou remover fontes de plugin:
  • Digite um repositório GitHub, URL ou caminho local para adicionar um novo marketplace
  • Clique no ícone de atualização para atualizar a lista de plugins de um marketplace
  • Clique no ícone de lixeira para remover um marketplace
Após fazer alterações, um banner o solicita a reiniciar Claude Code para aplicar as atualizações.
O gerenciamento de plugins no VS Code usa os mesmos comandos CLI sob o capô. Plugins e marketplaces que você configura na extensão também estão disponíveis no CLI, e vice-versa.
Para mais sobre o sistema de plugins, consulte Plugins e Plugin marketplaces.

​
Automatize tarefas do navegador com Chrome

Conecte Claude ao seu navegador Chrome para testar aplicativos web, depurar com logs de console e automatizar fluxos de trabalho do navegador sem sair do VS Code. Isso requer a Claude in Chrome extension versão 1.0.36 ou superior. Digite @browser na caixa de prompt seguido do que você quer que Claude faça: 
@browser go to localhost:3000 and check the console for errors
Você também pode abrir o menu de anexos para selecionar ferramentas específicas do navegador como abrir uma nova aba ou ler conteúdo da página. Claude abre novas abas para tarefas do navegador e compartilha o estado de login do seu navegador, então pode acessar qualquer site em que você já esteja conectado. Para instruções de configuração, a lista completa de capacidades e solução de problemas, consulte Use Claude Code with Chrome.

​
Comandos e atalhos de teclado do VS Code

Abra a Paleta de Comandos (Cmd+Shift+P no Mac ou Ctrl+Shift+P no Windows/Linux) e digite “Claude Code” para ver todos os comandos VS Code disponíveis para a extensão Claude Code. Alguns atalhos dependem de qual painel está “focado” (recebendo entrada de teclado). Quando seu cursor está em um arquivo de código, o editor está focado. Quando seu cursor está na caixa de prompt do Claude, Claude está focado. Use Cmd+Esc / Ctrl+Esc para alternar entre eles.
Estes são comandos VS Code para controlar a extensão. Nem todos os comandos Claude Code integrados estão disponíveis na extensão. Consulte VS Code extension vs. Claude Code CLI para detalhes.
ComandoAtalhoDescrição
Focus InputCmd+Esc (Mac) / Ctrl+Esc (Windows/Linux)Alterne o foco entre editor e Claude
Open in Side Bar-Abra Claude na barra lateral esquerda
Open in Terminal-Abra Claude em modo terminal
Open in New TabCmd+Shift+Esc (Mac) / Ctrl+Shift+Esc (Windows/Linux)Abra uma nova conversa como uma aba do editor
Open in New Window-Abra uma nova conversa em uma janela separada
New ConversationCmd+N (Mac) / Ctrl+N (Windows/Linux)Inicie uma nova conversa (requer que Claude esteja focado)
Insert @-Mention ReferenceOption+K (Mac) / Alt+K (Windows/Linux)Insira uma referência ao arquivo atual e seleção (requer que o editor esteja focado)
Show Logs-Visualize logs de depuração da extensão
Logout-Saia de sua conta Anthropic

​
Configure as configurações

A extensão tem dois tipos de configurações:
  • Configurações de extensão no VS Code: Controlam o comportamento da extensão dentro do VS Code. Abra com Cmd+, (Mac) ou Ctrl+, (Windows/Linux), depois vá para Extensions → Claude Code. Você também pode digitar / e selecionar General Config para abrir as configurações.
  • Configurações Claude Code em ~/.claude/settings.json: Compartilhadas entre a extensão e CLI. Use para comandos permitidos, variáveis de ambiente, hooks e MCP servers. Consulte Settings para detalhes.
Adicione "$schema": "https://json.schemastore.org/claude-code-settings.json" ao seu settings.json para obter autocompletar e validação inline para todas as configurações disponíveis diretamente no VS Code.

​
Configurações de extensão

ConfiguraçãoPadrãoDescrição
selectedModeldefaultModelo para novas conversas. Altere por sessão com /model.
useTerminalfalseInicie Claude em modo terminal em vez de painel gráfico
initialPermissionModedefaultControla prompts de aprovação: default (pergunte cada vez), plan, acceptEdits ou bypassPermissions
preferredLocationpanelOnde Claude abre: sidebar (direita) ou panel (nova aba)
autosavetrueSalve automaticamente arquivos antes de Claude lê-los ou escrevê-los
useCtrlEnterToSendfalseUse Ctrl/Cmd+Enter em vez de Enter para enviar prompts
enableNewConversationShortcuttrueHabilite Cmd/Ctrl+N para iniciar uma nova conversa
hideOnboardingfalseOculte a lista de verificação de onboarding (ícone de chapéu de formatura)
respectGitIgnoretrueExclua padrões .gitignore de pesquisas de arquivo
environmentVariables[]Defina variáveis de ambiente para o processo Claude. Use configurações Claude Code em vez disso para configuração compartilhada.
disableLoginPromptfalsePule prompts de autenticação (para configurações de provedor de terceiros)
allowDangerouslySkipPermissionsfalseIgnore todos os prompts de permissão. Use com extrema cautela.
claudeProcessWrapper-Caminho executável usado para iniciar o processo Claude

​
VS Code extension vs. Claude Code CLI

Claude Code está disponível como uma extensão VS Code (painel gráfico) e um CLI (interface de linha de comando no terminal). Alguns recursos estão disponíveis apenas no CLI. Se você precisar de um recurso apenas CLI, execute claude no terminal integrado do VS Code.
RecursoCLIExtensão VS Code
Comandos e skillsTodosSubconjunto (digite / para ver disponíveis)
Configuração MCP serverSimNão (configure via CLI, use na extensão)
CheckpointsSimSim
Atalho bash !SimNão
Conclusão de abaSimNão

​
Retroceda com checkpoints

A extensão VS Code suporta checkpoints, que rastreiam edições de arquivo do Claude e permitem que você retroceda para um estado anterior. Passe o mouse sobre qualquer mensagem para revelar o botão de retrocesso, depois escolha entre três opções:
  • Fork conversation from here: inicie um novo ramo de conversa a partir desta mensagem mantendo todas as alterações de código intactas
  • Rewind code to here: reverta alterações de arquivo de volta a este ponto na conversa mantendo o histórico completo de conversas
  • Fork conversation and rewind code: inicie um novo ramo de conversa e reverta alterações de arquivo para este ponto
Para detalhes completos sobre como checkpoints funcionam e suas limitações, consulte Checkpointing.

​
Execute CLI no VS Code

Para usar o CLI enquanto permanece no VS Code, abra o terminal integrado (Ctrl+` no Windows/Linux ou Cmd+` no Mac) e execute claude. O CLI se integra automaticamente com seu IDE para recursos como visualização de diff e compartilhamento de diagnósticos. Se usar um terminal externo, execute /ide dentro do Claude Code para conectá-lo ao VS Code.

​
Alterne entre extensão e CLI

A extensão e CLI compartilham o mesmo histórico de conversas. Para continuar uma conversa de extensão no CLI, execute claude --resume no terminal. Isso abre um seletor interativo onde você pode pesquisar e selecionar sua conversa.

​
Inclua saída de terminal em prompts

Referencie saída de terminal em seus prompts usando @terminal:name onde name é o título do terminal. Isso permite que Claude veja saída de comando, mensagens de erro ou logs sem copiar e colar.

​
Monitore processos em segundo plano

Quando Claude executa comandos de longa duração, a extensão mostra progresso na barra de status. No entanto, a visibilidade para tarefas em segundo plano é limitada em comparação com o CLI. Para melhor visibilidade, peça ao Claude para exibir o comando para que você possa executá-lo no terminal integrado do VS Code.

​
Conecte-se a ferramentas externas com MCP

MCP (Model Context Protocol) servers dão ao Claude acesso a ferramentas externas, bancos de dados e APIs. Configure-os via CLI, depois use-os em extensão e CLI. Para adicionar um MCP server, abra o terminal integrado (Ctrl+` ou Cmd+`) e execute: 
claude mcp add --transport http github https://api.githubcopilot.com/mcp/
Após configurar, peça ao Claude para usar as ferramentas (por exemplo, “Review PR #456”). Alguns servidores requerem autenticação: execute claude no terminal, depois digite /mcp para autenticar. Consulte a MCP documentation para servidores disponíveis.

​
Trabalhe com git

Claude Code se integra com git para ajudar com fluxos de trabalho de controle de versão diretamente no VS Code. Peça ao Claude para fazer commit de alterações, criar pull requests ou trabalhar em branches.

​
Crie commits e pull requests

Claude pode preparar alterações, escrever mensagens de commit e criar pull requests com base em seu trabalho: 
> commit my changes with a descriptive message
> create a pr for this feature
> summarize the changes I've made to the auth module
Ao criar pull requests, Claude gera descrições com base nas alterações de código reais e pode adicionar contexto sobre testes ou decisões de implementação.

​
Use git worktrees para tarefas paralelas

Git worktrees permitem que múltiplas sessões Claude Code trabalhem em branches separadas simultaneamente, cada uma com arquivos isolados: 
# Create a worktree for a new feature
git worktree add ../project-feature-a -b feature-a

# Run Claude Code in each worktree
cd ../project-feature-a && claude
Cada worktree mantém estado de arquivo independente enquanto compartilha histórico git. Isso evita que instâncias Claude interfiram uma com a outra ao trabalhar em diferentes tarefas. Para fluxos de trabalho git detalhados incluindo revisões de PR e gerenciamento de branch, consulte Common workflows.

​
Use provedores de terceiros

Por padrão, Claude Code se conecta diretamente à API da Anthropic. Se sua organização usa Amazon Bedrock, Google Vertex AI ou Microsoft Foundry para acessar Claude, configure a extensão para usar seu provedor em vez disso:
1

Desabilite o prompt de login

Abra a Disable Login Prompt setting e marque a caixa.Você também pode abrir as configurações do VS Code (Cmd+, no Mac ou Ctrl+, no Windows/Linux), pesquisar por “Claude Code login” e marcar Disable Login Prompt.
2

Configure seu provedor

Siga o guia de configuração para seu provedor:Estes guias cobrem a configuração de seu provedor em ~/.claude/settings.json, o que garante que suas configurações sejam compartilhadas entre a extensão VS Code e o CLI.

​
Segurança e privacidade

Seu código permanece privado. Claude Code processa seu código para fornecer assistência, mas não o usa para treinar modelos. Para detalhes sobre manipulação de dados e como optar por não fazer logging, consulte Data and privacy. Com permissões de auto-edição habilitadas, Claude Code pode modificar arquivos de configuração do VS Code (como settings.json ou tasks.json) que o VS Code pode executar automaticamente. Para reduzir o risco ao trabalhar com código não confiável:
  • Habilite VS Code Restricted Mode para espaços de trabalho não confiáveis
  • Use modo de aprovação manual em vez de auto-aceitar para edições
  • Revise as alterações cuidadosamente antes de aceitá-las

​
Corrija problemas comuns

​
A extensão não será instalada

  • Certifique-se de ter uma versão compatível do VS Code (1.98.0 ou posterior)
  • Verifique se o VS Code tem permissão para instalar extensões
  • Tente instalar diretamente do VS Code Marketplace

​
Ícone Spark não visível

O ícone Spark aparece na Barra de Ferramentas do Editor (canto superior direito do editor) quando você tem um arquivo aberto. Se você não o vir:
  1. Abra um arquivo: O ícone requer um arquivo aberto. Ter apenas uma pasta aberta não é suficiente.
  2. Verifique a versão do VS Code: Requer 1.98.0 ou superior (Help → About)
  3. Reinicie o VS Code: Execute “Developer: Reload Window” na Paleta de Comandos
  4. Desabilite extensões conflitantes: Desabilite temporariamente outras extensões de IA (Cline, Continue, etc.)
  5. Verifique a confiança do espaço de trabalho: A extensão não funciona em Modo Restrito
Alternativamente, clique em ”✱ Claude Code” na Barra de Status (canto inferior direito). Isso funciona mesmo sem um arquivo aberto. Você também pode usar a Paleta de Comandos (Cmd+Shift+P / Ctrl+Shift+P) e digitar “Claude Code”.

​
Claude Code nunca responde

Se Claude Code não está respondendo aos seus prompts:
  1. Verifique sua conexão com a internet: Certifique-se de ter uma conexão com a internet estável
  2. Inicie uma nova conversa: Tente iniciar uma conversa nova para ver se o problema persiste
  3. Tente o CLI: Execute claude do terminal para ver se você obtém mensagens de erro mais detalhadas
Se os problemas persistirem, file an issue on GitHub com detalhes sobre o erro.

​
Desinstale a extensão

Para desinstalar a extensão Claude Code:
  1. Abra a visualização de Extensões (Cmd+Shift+X no Mac ou Ctrl+Shift+X no Windows/Linux)
  2. Pesquise por “Claude Code”
  3. Clique em Uninstall
Para também remover dados de extensão e redefinir todas as configurações: 
rm -rf ~/.vscode/globalStorage/anthropic.claude-code
Para ajuda adicional, consulte o troubleshooting guide.

​
Próximos passos

Agora que você tem Claude Code configurado no VS Code:
  • Explore common workflows para aproveitar ao máximo Claude Code
  • Set up MCP servers para estender os recursos do Claude com ferramentas externas. Configure servidores usando o CLI, depois use-os na extensão.
  • Configure Claude Code settings para personalizar comandos permitidos, hooks e muito mais. Essas configurações são compartilhadas entre a extensão e CLI.