Перейти до основного вмісту

​
Попередні перегляди

Коли ви відкриваєте чернетку додатку, Kazzle може запустити dev-сервер і показати живий попередній перегляд.

​
Як це працює

  1. Відкрийте вкладку чернетки з бічної панелі
  2. Попередній перегляд запускається автоматично (або натисніть “Запустити попередній перегляд” вручну)
  3. Kazzle читає lifecycle.dev з вашого kazzle.config.ts
  4. Команда dev запускається на призначеному порту
  5. URL попереднього перегляду з’являється на вкладці чернетки

​
Налаштування команди dev

Встановіть lifecycle.dev на вашому компоненті UI: 
import { defineConfig } from './kazzle.types';

export default defineConfig({
  components: [
    {
      name: 'My App',
      type: 'ui',
      path: '.',
      lifecycle: { dev: 'bun run dev' }
    }
  ]
});
Якщо lifecycle.dev не встановлено, система попереднього перегляду повертається до автоматичного виявлення dev-сервера (Vite, Next.js тощо).

​
URL-адреси попередніх переглядів

Кожен додаток отримує виділений порт у своїй пісочниці. URL попереднього перегляду відповідає шаблону: 
http://localhost:{PORT}
Змінна середовища PORT автоматично встановлюється системою попереднього перегляду.

​
Гарячий перезавантаження

Зміни у вашому коді підхоплюються гарячим перезавантаженням dev-сервера (HMR). Попередній перегляд оновлюється в реальному часі під час редагування файлів вами або ШІ.

​
Ручне керування

  • Запустити попередній перегляд — запускає dev-сервер, якщо він не працює
  • Зупинити попередній перегляд — завершує процес dev-сервера
  • Перезапустити — зупинити + запустити (корисно після змін конфігурації)

​
Перевірка

Попередній перегляд перевіряється лише коли вкладка app-dev відкривається і показує очікуваний інтерфейс. Тайм-аут, помилка відкриття вкладки, зупинений процес або відсутня URL-адреса попереднього перегляду означають, що попередній перегляд ще не перевірено. Коли ШІ створює додаток, він повинен відкрити вкладку app-dev після запуску або зміни чернетки. Він не повинен стверджувати, що додаток працює лише на основі виходу команди.