Ana içeriğe atla

Önizlemeler

Bir uygulama taslağını açtığınızda, Kazzle bir geliştirme sunucusu başlatabilir ve canlı bir önizleme gösterebilir.

Nasıl çalışır

  1. Kenar çubuğundan bir taslak sekmesi açın
  2. Önizleme otomatik olarak başlar (veya “Önizlemeyi başlat” düğmesine tıklayın)
  3. Kazzle, kazzle.config.ts dosyasından lifecycle.dev öğesini okur
  4. Geliştirme komutu atanan bağlantı noktasında çalışır
  5. Önizleme URL’si taslak sekmesinde görünür

Geliştirme komutunu yapılandırma

UI bileşeninizde lifecycle.dev öğesini ayarlayın:
import { defineConfig } from './kazzle.types';

export default defineConfig({
  components: [
    {
      name: 'My App',
      type: 'ui',
      path: '.',
      lifecycle: { dev: 'bun run dev' }
    }
  ]
});
lifecycle.dev ayarlanmamışsa, önizleme sistemi yaygın geliştirme sunucusu algılamasına geri döner (Vite, Next.js, vb.).

Önizleme URL’leri

Her uygulama, korumalı alanında ayrılmış bir bağlantı noktası alır. Önizleme URL’si şu deseni izler:
http://localhost:{PORT}
PORT ortam değişkeni, önizleme sistemi tarafından otomatik olarak ayarlanır.

Sıcak yenileme

Kodunuzdaki değişiklikler, geliştirme sunucunuzun sıcak yenileme (HMR) tarafından algılanır. Siz veya yapay zeka dosyaları düzenledikçe önizleme gerçek zamanlı olarak güncellenir.

Manuel kontroller

  • Önizlemeyi başlat — geliştirme sunucusu çalışmıyorsa başlatır
  • Önizlemeyi durdur — geliştirme sunucusu işlemini sonlandırır
  • Yeniden başlat — durdur + başlat (yapılandırma değişikliklerinden sonra yararlı)

Doğrulama

Bir önizleme, yalnızca uygulama-geliştirme sekmesi açıldığında ve beklenen kullanıcı arabirimi gösterildiğinde doğrulanır. Zaman aşımı, başarısız sekme açılması, durdurulmuş işlem veya eksik önizleme URL’si, önizlemenin henüz doğrulanmadığı anlamına gelir. Yapay zeka bir uygulama oluşturduğunda, taslağı başlattıktan veya değiştirdikten sonra uygulama-geliştirme sekmesini açmalıdır. Yalnızca komut çıktısından uygulamanın çalıştığını iddia etmemelidir.