Chuyển đến nội dung chính

Cấu hình

Mỗi ứng dụng Kazzle có một kazzle.config.ts ở thư mục gốc của dự án. Tệp này xác định những gì ứng dụng của bạn chứa — các thành phần, kỹ năng và siêu dữ liệu.

Bắt đầu nhanh

import { defineConfig } from './kazzle.types';

export default defineConfig({
  components: [
    { name: 'My App', type: 'ui', path: '.' }
  ]
});
Trợ giúp defineConfig cung cấp tự động hoàn thành TypeScript và xác thực. Các kiểu đến từ kazzle.types.ts, được tạo tự động và bao gồm trong mọi mẫu.

Các trường cấp cao nhất

TrườngKiểuBắt buộcMô tả
iconstringkhôngĐường dẫn đến tệp biểu tượng ứng dụng tương đối với thư mục gốc kho lưu trữ (png, jpg, svg, webp, ico). Được tải lên CDN khi xuất bản.
componentsobject[]khôngCác thành phần có thể thực thi — giao diện người dùng hoặc quy trình nền
skillsobject[]khôngĐịnh nghĩa kỹ năng AI — các tệp markdown mà AI đọc để có kiến thức miền
capabilitiesobjectkhôngCác tính năng tích hợp máy tính để bàn tùy chọn như phím tắt, thông báo và sự hiện diện thanh trạng thái

Các trường thành phần

Mỗi mục trong components[]:
TrườngKiểuBắt buộcMô tả
namestringTên thành phần duy nhất trong ứng dụng
type"ui" | "process"Loại thành phần — ui (tối đa 1) hoặc process
pathstringĐường dẫn mục nhập trong thư mục ứng dụng
runtimeobjectkhôngLệnh: { dev?, build?, run? }
runtime.devstringkhôngLệnh để bắt đầu máy chủ phát triển (ví dụ: "bun run dev")
runtime.buildstringkhôngLệnh để xây dựng cho sản xuất (ví dụ: "vite build")
runtime.runstringkhôngLệnh để bắt đầu trong sản xuất (ví dụ: "bun run start")
schedulestringkhôngLịch trình Cron cho các thành phần quy trình (ví dụ: "*/5 * * * *")
trigger"webhook" | "event"khôngChế độ kích hoạt cho các thành phần quy trình
envobjectkhôngBộ sưu tập bí mật + môi trường để tiêm biến env
env.collectionstringcó (nếu env)Slug bộ sưu tập bí mật
env.environmentstringcó (nếu env)Slug môi trường
env.includestring[]khôngChỉ tiêm các tên biến env này. Nếu bỏ qua, tiêm tất cả từ bộ sưu tập + môi trường.

Các trường kỹ năng

Mỗi mục trong skills[]:
TrườngKiểuBắt buộcMô tả
namestringTên kỹ năng
pathstringĐường dẫn đến tệp SKILL.md tương đối với thư mục gốc ứng dụng

Ràng buộc

  • Tối đa 1 thành phần UI trên mỗi ứng dụng
  • Các giá trị name của thành phần phải là duy nhất trong ứng dụng

Ví dụ mẫu

ứng dụng ui

import { defineConfig } from './kazzle.types';

export default defineConfig({
  /** Đường dẫn đến biểu tượng ứng dụng tương đối với thư mục gốc kho lưu trữ. Được tải lên CDN khi xuất bản. */
  icon: 'components/ui/public/favicon.svg',
  /** Các thành phần ứng dụng — mỗi mục xác định một đơn vị có thể triển khai. Tối đa 1 thành phần UI. */
  components: [
    { name: 'My App', type: 'ui', path: './components/ui' },
  ],
});

ứng dụng process

import { defineConfig } from './kazzle.types';

export default defineConfig({
  /** Đường dẫn đến biểu tượng ứng dụng tương đối với thư mục gốc kho lưu trữ. Được tải lên CDN khi xuất bản. */
  icon: 'icon.svg',
  /** Các thành phần ứng dụng — mỗi mục xác định một đơn vị có thể triển khai. */
  components: [
    {
      name: 'My App',
      type: 'process',
      path: './components/process/index.ts',
      runtime: { dev: 'bun run dev', run: 'bun run start' },
      // Các quy trình liên tục là các máy chủ chạy lâu dài. Nền tảng đăng
      // các kích hoạt vào máy chủ đang chạy tại `path` của mỗi kích hoạt với
      // `Authorization: Bearer ${KAZZLE_TRIGGER_SECRET}`. Mã khách hàng
      // xác thực tiêu đề trước khi thực hiện công việc.
      processMode: 'persistent',
      triggers: [
        // Ví dụ cron — bỏ ghi chú và điều chỉnh. 5 trường, độ phân giải phút.
        // { name: 'hourly-sync', kind: 'schedule', schedule: '0 * * * *', path: '/cron/hourly-sync' },
        // Ví dụ webhook — POSTs đến /webhooks/{spaceId}/{appId}/My App/incoming
        // { name: 'incoming', kind: 'webhook', path: '/webhook/incoming' },
      ],
    },
  ],
});

ứng dụng trống

import { defineConfig } from './kazzle.types';

export default defineConfig({
  /** Đường dẫn đến biểu tượng ứng dụng tương đối với thư mục gốc kho lưu trữ. Được tải lên CDN khi xuất bản. */
  icon: 'icon.svg',
  /** Các thành phần ứng dụng — mỗi mục xác định một đơn vị có thể triển khai. */
  components: [],
});