Skip to main content

Anteprime

Quando apri una bozza di app, Kazzle può avviare un server di sviluppo e mostrare un’anteprima live.

Come funziona

  1. Apri una scheda bozza dalla barra laterale
  2. L’anteprima si avvia automaticamente (oppure fai clic su “Avvia anteprima” manualmente)
  3. Kazzle legge lifecycle.dev dal tuo kazzle.config.ts
  4. Il comando dev viene eseguito sulla porta assegnata
  5. L’URL dell’anteprima appare nella scheda bozza

Configurazione del comando dev

Imposta lifecycle.dev sul tuo componente UI:
Se lifecycle.dev non è impostato, il sistema di anteprima ricade sul rilevamento automatico del server di sviluppo comune (Vite, Next.js, ecc.).

URL delle anteprime

Ogni app ottiene una porta dedicata nella sua sandbox. L’URL dell’anteprima segue il modello:
La variabile di ambiente PORT viene impostata automaticamente dal sistema di anteprima.

Ricaricamento a caldo

Le modifiche al tuo codice vengono rilevate dal ricaricamento a caldo (HMR) del tuo server di sviluppo. L’anteprima si aggiorna in tempo reale mentre tu o l’AI modificate i file.

Controlli manuali

  • Avvia anteprima — avvia il server di sviluppo se non è in esecuzione
  • Arresta anteprima — termina il processo del server di sviluppo
  • Riavvia — arresta + avvia (utile dopo modifiche alla configurazione)

Verifica

Un’anteprima viene verificata solo quando la scheda app-dev si apre e mostra l’interfaccia utente prevista. Un timeout, un’apertura della scheda non riuscita, un processo interrotto o un URL di anteprima mancante significano che l’anteprima non è ancora verificata. Quando l’AI crea un’app, dovrebbe aprire la scheda app-dev dopo aver avviato o modificato la bozza. Non dovrebbe affermare che l’app è in esecuzione basandosi solo sull’output del comando.