---
title: Extensión de VS Code
description: "Inicia, detiene y reinicia el servidor de Jamdesk desde la barra de estado de Visual Studio Code con controles de un clic y preview automático."
---

Previsualiza tu documentación sin salir de Visual Studio Code. La extensión de Jamdesk añade un botón en la barra de estado que inicia `jamdesk dev`, monitoriza el servidor y abre tu navegador cuando está listo. No se requiere terminal.

## Requisitos previos

- [CLI de Jamdesk](/es/cli/overview) instalado (`npm install -g jamdesk`)
- Un workspace que contenga un archivo `docs.json`

## Instalar la extensión

Busca **Jamdesk** en el panel de extensiones de VS Code (`Cmd+Shift+X` en macOS, `Ctrl+Shift+X` en Windows/Linux) y haz clic en **Install**. O instala directamente desde el [VS Code Marketplace](https://marketplace.visualstudio.com/items?itemName=Jamdesk.jamdesk).

La extensión se activa automáticamente cuando tu workspace contiene un archivo `docs.json`. Un botón de reproducción aparece en la barra de estado.

## Iniciar el servidor de desarrollo

Haz clic en el botón de reproducción en la barra de estado para iniciar el servidor de desarrollo. La extensión:

1. Lanza `jamdesk dev` como proceso hijo
2. Monitoriza la salida para detectar cuándo el servidor está listo
3. Abre tu navegador en el preview local (si la apertura automática está habilitada)

La barra de estado muestra el estado actual del servidor: iniciando, en ejecución o detenido.

## Comandos

Abre la paleta de comandos (`Cmd+Shift+P` / `Ctrl+Shift+P`) y escribe "Jamdesk" para acceder a:

| Comando | Descripción |
|---------|-------------|
| **Jamdesk: Start Dev Server** | Inicia el servidor de desarrollo |
| **Jamdesk: Stop Dev Server** | Detiene el servidor en ejecución |
| **Jamdesk: Restart Dev Server** | Reinicia el servidor |
| **Jamdesk: Show Output** | Muestra el canal de salida del CLI |

## Configuración

Configura la extensión en los ajustes de VS Code (`Cmd+,` / `Ctrl+,`) bajo **Jamdesk**:

| Ajuste | Predeterminado | Descripción |
|--------|---------------|-------------|
| `jamdesk.port` | `3000` | Puerto preferido del servidor de desarrollo |
| `jamdesk.verbose` | `false` | Habilita la salida detallada del CLI |
| `jamdesk.clean` | `false` | Limpia la caché del build en el próximo inicio |
| `jamdesk.browserMode` | `external` | Dónde abrir el preview: `external` (navegador del sistema) o `embedded` (panel lateral de VS Code) |
| `jamdesk.autoOpenBrowser` | `true` | Abre el navegador cuando el servidor está listo |

<Tip>
Establece `browserMode` en `embedded` para abrir el preview de la documentación en un panel lateral de VS Code. Esto te permite editar y previsualizar en paralelo sin cambiar de ventana.
</Tip>

## Gestión inteligente de puertos

Si tu puerto preferido ya está en uso, el CLI incrementa automáticamente al siguiente puerto disponible. La extensión detecta el puerto real a partir de la salida del CLI, por lo que el navegador siempre se abre en la URL correcta.

## Canal de salida

La extensión transmite toda la salida del CLI a un canal de salida dedicado **Jamdesk**. Ábrelo con el comando **Jamdesk: Show Output** o desde el menú desplegable del panel de salida.

Úsalo para:
- Monitorizar el progreso del build
- Depurar problemas del servidor
- Ver logs detallados (cuando `jamdesk.verbose` está habilitado)

## ¿Qué sigue?

<Columns cols={2}>
  <Card title="Preview local" icon="eye" href="/es/development/local-preview">
    Preview basado en CLI con puertos personalizados y modo detallado
  </Card>
  <Card title="Descripción general del CLI" icon="terminal" href="/es/cli/overview">
    Referencia completa de comandos del CLI
  </Card>
</Columns>