Documentación / VS Code

Publicar una preview sin salir de Visual Studio Code

Instala PreviewShip en Visual Studio Code, guarda tu API key y publica el archivo activo o una salida dist/build como URL de preview.

Actualizado 2026-07-27Guía práctica de despliegue

Respuesta directa

La extensión PreviewShip para Visual Studio Code permite desplegar el archivo HTML, Markdown o PDF activo, o publicar la salida estática de un proyecto. Instala la extensión, configura la API key una vez y elige entre desplegar el archivo activo o el workspace listo para navegador.

Despliega artefactos de build, no zips de código fuente.

Si subes un zip, compila primero y comprime la salida estática como dist, build, out o public con index.html y assets. No subas carpetas fuente de React/Vue/Next con package.json, src y node_modules. Los archivos .html, .md/.markdown y .pdf únicos se despliegan directamente desde consola, CLI, MCP y la extensión VS Code/Cursor.

Puntos clave

Archivo activo es la ruta más corta para un HTML, Markdown o PDF individual.
Workspace deploy sirve cuando el proyecto ya tiene una salida estática como dist/build/out.
No necesitas conectar un repositorio Git para generar el enlace de preview.
La extensión publica artifacts; no ejecuta npm install ni convierte código fuente en build.

Flujo recomendado

1

Instala la extensión con `ext install previewship.previewship` o desde VS Code Marketplace.

2

Abre Command Palette y ejecuta “PreviewShip: Set API Key”.

3

Para un archivo individual, abre el .html/.md/.pdf y ejecuta “Deploy Active HTML, Markdown, or PDF File”.

4

Para un framework, ejecuta el build y abre la carpeta que contiene dist/build/out.

5

Ejecuta “Deploy Workspace…” y abre la URL generada para comprobar el resultado.

Comparación rápida

EntradaComando recomendadoPreparación
Un archivo HTMLDeploy Active HTML…Documento HTML completo
Markdown o PDFDeploy Active…Guardar el archivo antes de publicar
Vite/React/VueDeploy Workspace…Ejecutar build y usar dist/build
Proyecto fuenteNo desplegar todavíaCompilar y verificar index.html

Archivo activo o workspace

El archivo activo evita crear un ZIP cuando solo necesitas compartir una página, un documento Markdown o un PDF. El workspace es adecuado para una web con index.html y assets locales.

Antes de publicar un workspace de framework, comprueba que la carpeta elegida contiene salida estática, no src ni node_modules.

Flujo desde Command Palette

Guarda el archivo, abre Command Palette, busca PreviewShip y elige el comando que corresponde a la entrada. La extensión reutiliza la API key guardada y devuelve el enlace al terminar.

Si no aparece el comando, confirma que la extensión está habilitada en la ventana actual y que el archivo o carpeta cumple el tipo soportado.

Errores frecuentes en VS Code

Un error de autenticación requiere volver a configurar la API key. Un preview vacío suele indicar que se desplegó código fuente o una carpeta sin index.html. Los assets 404 normalmente apuntan a rutas relativas o diferencias de mayúsculas.

La extensión puede instalarse desde un paquete VSIX, pero el despliegue necesita conexión con PreviewShip.

Fuentes oficiales

Los datos del producto y del flujo se verificaron en estas páginas oficiales el 2026-07-27.

FAQ

¿Necesito Git para publicar desde VS Code?

No. PreviewShip despliega el artifact local y no exige un repositorio conectado.

¿Puedo publicar solo el HTML abierto?

Sí. Abre el archivo y usa el comando para desplegar el archivo activo.

¿La extensión compila React o Vue?

No. Ejecuta el build y despliega la salida estática generada.

¿VS Code admite herramientas MCP además de extensiones?

Sí. VS Code distingue herramientas integradas, herramientas de extensiones y herramientas MCP; elige el camino que corresponda a tu flujo.