---
title: Extensão do VS Code
description: Inicie, pare e reinicie o servidor de desenvolvimento Jamdesk pela barra de status do Visual Studio Code, com controles rápidos e pré-visualização automática.
---

> **For AI agents:** the complete documentation index is at [llms.txt](/docs/llms.txt). Append `.md` to any page URL for its markdown version.

Pré-visualize sua documentação sem sair do Visual Studio Code. A extensão do Jamdesk adiciona um botão à barra de status que inicia `jamdesk dev`, monitora o servidor e abre o navegador quando ele está pronto. Não é necessário usar o terminal.

## Pré-requisitos

- [Jamdesk CLI](/pt/cli/overview) instalado (`npm install -g jamdesk`)
- Um espaço de trabalho que contenha um arquivo `docs.json`

## Instalar a extensão

Pesquise por **Jamdesk** no painel Extensions do VS Code (`Cmd+Shift+X` no macOS, `Ctrl+Shift+X` no Windows/Linux) e clique em **Install**. Ou instale diretamente pelo [VS Code Marketplace](https://marketplace.visualstudio.com/items?itemName=Jamdesk.jamdesk).

A extensão é ativada automaticamente quando seu espaço de trabalho contém um arquivo `docs.json`. Um botão de reprodução aparece na barra de status.

## Iniciar o servidor de desenvolvimento

Clique no botão de reprodução na barra de status para iniciar o servidor de desenvolvimento. A extensão:

1. Inicia `jamdesk dev` como um processo filho
2. Monitora a saída para detectar quando o servidor está pronto
3. Abre o navegador na pré-visualização local, se a abertura automática estiver ativada

A barra de status mostra o estado atual do servidor: iniciando, em execução ou parado.

## Comandos

Abra a Command Palette (`Cmd+Shift+P` / `Ctrl+Shift+P`) e digite "Jamdesk" para acessar:

| Comando | Descrição |
|---------|-------------|
| **Jamdesk: Start Dev Server** | Iniciar o servidor de desenvolvimento |
| **Jamdesk: Stop Dev Server** | Parar o servidor em execução |
| **Jamdesk: Restart Dev Server** | Reiniciar o servidor |
| **Jamdesk: Show Output** | Mostrar o canal de saída da CLI |

## Configurações

Configure a extensão nas configurações do VS Code (`Cmd+,` / `Ctrl+,`), em **Jamdesk**:

| Configuração | Padrão | Descrição |
|---------|---------|-------------|
| `jamdesk.port` | `3000` | Porta preferencial do servidor de desenvolvimento |
| `jamdesk.verbose` | `false` | Ativar a saída detalhada da CLI |
| `jamdesk.clean` | `false` | Limpar o cache de build na próxima inicialização |
| `jamdesk.browserMode` | `external` | Onde abrir a pré-visualização: `external` (navegador do sistema) ou `embedded` (painel lateral do VS Code) |
| `jamdesk.autoOpenBrowser` | `true` | Abrir o navegador quando o servidor estiver pronto |

<Tip>
Defina `browserMode` como `embedded` para abrir a pré-visualização da documentação em um painel lateral do VS Code. Assim, você pode editar e pré-visualizar lado a lado sem alternar entre janelas.
</Tip>

## Gerenciamento inteligente de portas

Se a porta preferencial já estiver em uso, a CLI incrementará automaticamente para a próxima porta disponível. A extensão detecta a porta real na saída da CLI, para que o navegador sempre abra na URL correta.

## Canal de saída

A extensão transmite toda a saída da CLI para um canal de saída dedicado do **Jamdesk**. Abra-o com o comando **Jamdesk: Show Output** ou no menu suspenso do painel Output.

Use-o para:
- Monitorar o progresso do build
- Depurar problemas do servidor
- Consultar logs detalhados quando `jamdesk.verbose` estiver ativado

## O que vem a seguir?

<Columns cols={2}>
  <Card title="Pré-visualização local" icon="eye" href="/pt/development/local-preview">
    Pré-visualização baseada na CLI com portas personalizadas e modo detalhado
  </Card>
  <Card title="Visão geral da CLI" icon="terminal" href="/pt/cli/overview">
    Referência completa dos comandos da CLI
  </Card>
</Columns>