Перейти к основному содержимому

Перевод: оболочка страницы на русском; тело навыка (SKILL.md) пока на английском — это исходные инструкции агента.

Desktop Local Preview

Open localhost apps in the desktop preview rail.

Метаданные навыка​

ИсточникВстроенный (установлен по умолчанию)
Путьskills/software-development/desktop-local-preview
Версия1.0.0
АвторVibeOS
ЛицензияMIT
Платформыmacos, windows, linux
Тегиdesktop, preview, localhost, webview, ship, internet
Связанные навыкиship-web-service, internet-starter, browser-e2e, browser-network-assert, design-to-code-loop

Справка: полный SKILL.md​

к сведению

Ниже полное определение навыка, которое VibeOS загружает при активации. Это инструкции, которые видит агент.

Desktop Local Preview

Use the existing Electron right-rail preview (<webview>) for localhost dev servers — no second chat UI. Agents surface a clickable preview link; users also run /preview or the command palette.

When to Use​

  • After starting Next/Vite/uvicorn locally in a desktop session
  • Ship loop step between health check and browser-e2e
  • User asks to “show the site in the app”

Prerequisites​

  • VibeOS Desktop with chat open
  • Server on loopback only (localhost / 127.0.0.1 / ::1)
  • Prefer vibeos project servers --expect <port> --health first

How to Run​

User (desktop)​

/preview                 → http://127.0.0.1:3000/
/preview 8000            → http://127.0.0.1:8000/
/preview http://127.0.0.1:5173/

Command palette: Open local preview (ports 3000 / 8000 / 5173 Vite).

Agent (message)​

Emit a markdown preview chip so the desktop opens the rail:

[Preview: app](#preview/http%3A%2F%2F127.0.0.1%3A3000%2F)

Helper form: #preview/ + encodeURIComponent(url).

Also OK: status-stack chips from tool output that mention localhost URLs (already auto-detected).

Quick Reference​

ActionSurface
Slash/preview [port|url]
PaletteOpen local preview
Markdown[Preview:…](#preview/<urlencoded-url>)
External browserCmd/Ctrl+click status chip / openPreviewInBrowser

Procedure​

  1. Confirm port free/listening (vibeos project servers).
  2. Start server in background via terminal.
  3. Open preview (/preview or markdown link).
  4. Assert health (browser-network-assert) and optional UI smoke (browser-e2e).

Pitfalls​

  • Non-loopback hosts are rejected by the desktop IPC guard.
  • Do not embed a second chat surface — only the preview pane.
  • iframe is wrong for Vite/HMR; the app uses <webview> already.

Verification​

  • Preview rail shows the page title/heading.
  • Reload and DevTools work from the preview titlebar.
  • Health URL still returns ok after design patches.