Revyl Documentation

Frameworks / Web

Vite

Build a static Vite Web app for a Revyl session or register its hosted preview.

Web is in Alpha. To add it to your organization, email support@revyl.ai.

Set up a static Vite app for a Revyl Web session. Revyl does not infer Vite, the package manager, or a preview host from revyl init; use the app's existing scripts and lockfile.

Set up with an agent

Paste one prompt and your coding agent does the rest.

Setup prompt

Set up Revyl for this static Vite app.

Read https://docs.revyl.com/frameworks/vite.md and follow it. It's the current Revyl guide for this, so prefer it over anything you remember about Revyl.

Web is in Alpha: if Revyl says Web isn't enabled for my organization, stop and tell me to email support@revyl.ai. If the app already deploys previews, register its HTTPS preview. Otherwise use the app's package manager to build a static directory with a root index.html, and set that directory as the Web recipe's output.

You're done when a Revyl Web session opens the Vite app and you've given me its link.

Ask me before anything that needs my login or approval.

Build guidance

Revyl serves the built static output directly in the Web session. Rebuild after a code change and open the new build in a new session. Revyl does not provide Web hot reload. If the app already deploys previews, register its HTTPS preview instead.

Prerequisites

  • A Vite app whose production build writes dist/index.html.
  • The package manager and lockfile already used by the app.
  • Revyl CLI installed and authenticated with revyl auth login.
  • Web enabled for your organization.

Configure a managed bundle

First create the Web app and project profile. Add a recipe using the app's package manager and build command:

build:
  profiles:
    preview:
      web:
        app_id: <web-app-id>
        setup_commands: [npm ci]
        build_commands: [npm run build]
        output_path: dist

No run block is needed for static output. Revyl requires the declared output directory to contain a root index.html. For an extensionless URL, Revyl serves the matching HTML file or falls back to index.html, so client-side routes load on reload or deep link. Missing assets still return 404.

Use the package manager and lockfile that the app already uses instead of copying npm ci blindly, and adjust output_path if the app uses a different output directory. This recipe is for a static site, not a Vite development server or an SSR build. See Web builds for bundle limits and output restrictions.

Use a hosted preview instead

Follow Register a deployed preview. This uses your existing host and also works when the app has a backend that the static bundle does not include.

Authentication

Do not put a signing secret in a static frontend. If the app needs sign-in, use its trusted backend's test-only route or a hosted preview. Web starts do not run session.before_script; seed test data through the preview deployment or prepare it explicitly before starting the session.

Build and open a session

revyl config validate
revyl build --profile preview --platform web
revyl device start --platform web --app <web-app-id>

Check the session, then stop it with:

revyl device stop --session-id <session-id>

Troubleshooting

Next steps

On this page