33. TypeScript-Generierung | Field Forge - Benutzerdefinierte Felder, gebaut für Geschwindigkeit
Herunterladen Anmelden

33. TypeScript-Generierung

Generieren Sie TypeScript-Schnittstellen aus Ihren Feldgruppen für typensichere headless Frontends. Erfordert PRO-Lizenz.

Struktur der generierten Typen

typescript
/**
 * Auto-generated by Field Forge v1.0.0
 */

export interface WPImage {
  ID: number;
  url: string;
  width: number;
  height: number;
  alt: string;
  title: string;
  sizes: Record<string, string>;
}

export interface WPFile {
  ID: number;
  url: string;
  filename: string;
  title: string;
  filesize: number;
  mime_type: string;
}

export interface ProductFields {
  price: number;
  sale_price?: number;
  product_gallery?: WPImage[];
  product_badge?: 'new' | 'sale' | 'bestseller' | '';
  product_specs?: Array<{ label?: string; value?: string }>;
}

export interface FieldForgePostTypeMap {
  'product': ProductFields;
  'page': PageFields;
}

Verwendung in Next.js

typescript
import type { ProductFields, WPImage } from './fieldforge.d.ts';

interface WPPost<T = Record<string, unknown>> {
  id: number;
  title: { rendered: string };
  fieldforge: T;
}

export async function getProduct(id: number): Promise<WPPost<ProductFields>> {
  const res = await fetch(`${process.env.WP_URL}/wp-json/wp/v2/product/${id}`);
  return res.json();
}

const product = await getProduct(42);
const price: number = product.fieldforge.price;

Herunterladen von Typen

text
GET /wp-admin/admin-ajax.php?action=fieldforge_download_types&format=typescript&nonce=xxx

Gibt fieldforge.d.ts als Datei-Download zurück.

Forge KI-Assistent Online

Hallo! Ich bin der Field Forge KI-Assistent. Fragen Sie mich alles über das Plugin — Einrichtung, Funktionen, Fehlerbehebung oder Entwicklung.

Gerade eben
Unterstützt von Forge KI · Dokumentation durchsuchen