Raycast API: Eigene Erweiterungen erstellen (Entwickler-Leitfaden 2026)

Eines der Dinge, die Raycast von anderen macOS-Launchern wie Spotlight oder Alfred abhebt, ist sein Erweiterungs-Ökosystem. Mit über 1.000 von der Community erstellten Erweiterungen im Raycast Store gibt es für fast alles ein Tool. Aber was, wenn du etwas Maßgeschneidertes brauchst? Die Raycast API ermöglicht es dir, eigene Erweiterungen mit React und TypeScript zu erstellen — ein Stack, den die meisten Entwickler bereits kennen.

In diesem Leitfaden führe ich dich durch alles, was du brauchst, um im Jahr 2026 eine Raycast-Erweiterung zu erstellen, zu testen und zu veröffentlichen. Ob du ein internes Tool für dein Team erstellen, einen sich wiederholenden Workflow automatisieren oder zum Open-Source-Store beitragen möchtest — hier ist dein Ausgangspunkt. Und wenn du noch erkundest, was Raycast kann, schau dir das aktuelle Raycast Pro Angebot an, um KI-Funktionen freizuschalten, die gut zu benutzerdefinierten Erweiterungen passen.

Was du mit der Raycast API erstellen kannst

Die Raycast API gibt dir Zugang zur vollständigen Launcher-Benutzeroberfläche und der Systemintegrationsschicht. Erweiterungen können:

• Listen und Grids anzeigen — durchsuchbare, filterbare Listen von Elementen (Repos, Aufgaben, Lesezeichen, alles)
• Detailansichten zeigen — reichhaltig mit Markdown gerenderter Inhalt mit Metadaten-Seitenleisten
• Formulare rendern — Eingabefelder, Dropdowns, Datumsauswahl, Dateiselektoren für die Dateneingabe
• Aktionen ausführen — URLs öffnen, Text kopieren, Shell-Befehle ausführen, API-Aufrufe auslösen
• In die Menüleiste integrieren — persistente Statusindikatoren und Schnellzugriff-Menüs
• Einstellungen und Daten speichern — lokaler Speicher für Einstellungen, Cache und Nutzerdaten
• Auf System-APIs zugreifen — Zwischenablage, Benachrichtigungen, ausgewählte Finder-Dateien, vorderste Anwendung

Beliebte mit der API erstellte Erweiterungen umfassen die GitHub-Erweiterung, Jira-Integration, Notion Quick Capture, Spotify-Steuerung und Hunderte mehr. Du kannst alle in der Übersicht der besten Raycast-Erweiterungen durchstöbern.

Der Tech-Stack: React + TypeScript

Wenn du React-Web-Apps erstellt hast, wird sich die Raycast-Entwicklungserfahrung sofort vertraut anfühlen. Erweiterungen werden in TypeScript (oder JavaScript, obwohl TypeScript dringend empfohlen wird) geschrieben und verwenden React-Komponenten des @raycast/api-Pakets.

Der wesentliche Unterschied zum Web-React: Du renderst nicht ins DOM. Raycast stellt eigene UI-Komponenten bereit — List, Detail, Form, Grid, ActionPanel — die nativ im Raycast-Fenster rendern. Das bedeutet konsistentes Styling, Tastaturnavigation und flüssige Performance, ohne jegliches CSS zu schreiben.

Hier ist eine minimale Erweiterung, die eine Liste anzeigt:

import { List } from "@raycast/api";

export default function Command() {
  return (
    <List>
      <List.Item title="Hallo Welt" subtitle="Meine erste Erweiterung" />
      <List.Item title="Ein weiteres Element" subtitle="Mit einem Icon" icon="star.png" />
    </List>
  );
}

Das war's. Keine Webpack-Konfiguration, kein CSS, kein Build-Tooling einzurichten. Raycast übernimmt das Rendering, die Tastaturnavigation und das Suchfiltern automatisch.

Erste Schritte: Deine erste Erweiterung

Voraussetzungen

• Raycast auf deinem Mac installiert (der kostenlose Plan ist für die Entwicklung ausreichend)
• Node.js Version 16 oder höher
• Ein Code-Editor (VS Code empfohlen — Raycast hat eine offizielle VS Code-Erweiterung für die Entwicklung)

Schritt 1: Die Erweiterung erstellen

Öffne Raycast und führe den Befehl “Create Extension” aus. Dies startet einen interaktiven Assistenten, in dem du wählst:

• Name und Beschreibung der Erweiterung
• Vorlage (List, Detail, Form oder leer)
• Verzeichnis, in dem das Projekt erstellt wird

Alternativ verwende die CLI:

npx create-raycast-extension meine-erweiterung

Dies erstellt ein vollständiges Projekt mit TypeScript-Konfiguration, package.json und einem Beispielbefehl.

Schritt 2: Die Projektstruktur verstehen

Ein Raycast-Erweiterungsprojekt sieht so aus:

meine-erweiterung/
  src/
    index.tsx          # Dein Hauptbefehl
    anderer-befehl.tsx  # Weitere Befehle
  assets/              # Icons und Bilder
  package.json         # Abhängigkeiten und Raycast-Metadaten
  tsconfig.json        # TypeScript-Konfiguration

Die package.json enthält Raycast-spezifische Metadaten unter dem raycast-Schlüssel: Erweiterungsname, Beschreibung, Befehle, Einstellungen und erforderliche Berechtigungen.

Schritt 3: Mit Hot Reload entwickeln

Den Entwicklungsserver starten:

npm run dev

Dies startet einen Beobachter, der bei Dateiänderungen neu kompiliert. In Raycast erscheint deine Entwicklungserweiterung automatisch. Jedes Mal, wenn du eine Datei speicherst, lädt die Erweiterung in Raycast neu — du erhältst nahezu sofortiges Feedback, ähnlich wie Hot Module Replacement in der Web-Entwicklung.

Schritt 4: Erstellen und Testen

Die Entwicklungsumgebung ist gleichzeitig deine Testumgebung. Interagiere direkt in Raycast mit deiner Erweiterung, während du sie erstellst. Es gibt keinen separaten Simulator oder Emulator — du testest gegen das echte Ding.

Zum Debuggen verwende console.log()-Anweisungen, die in der Raycast-Entwicklerkonsole erscheinen (zugänglich über den Befehl “Toggle Developer Tools”), oder verwende den VS Code-Debugger mit Raycasts Debug-Konfiguration.

Wichtige API-Komponenten

List

Die häufigste Komponente. Zeigt eine durchsuchbare Liste von Elementen mit Titeln, Untertiteln, Icons und Zubehör an. Unterstützt Abschnitte, Filterung und Paginierung. Die meisten Raycast-Erweiterungen sind listenbasiert.

Detail

Zeigt reichhaltigen Inhalt an, der aus Markdown gerendert wurde. Perfekt zum Anzeigen von README-Dateien, API-Antworten, Dokumentation oder anderen detaillierten Informationen. Unterstützt eine Metadaten-Seitenleiste für strukturierte Daten.

Form

Eingabeformulare mit Textfeldern, Textbereichen, Dropdowns, Checkboxen, Datumsauswahl und Dateiselektoren. Verwende diese, wenn deine Erweiterung Informationen vom Nutzer sammeln muss — wie das Erstellen eines Issues, das Verfassen einer Nachricht oder das Konfigurieren von Einstellungen.

Grid

Ein visuelles Grid-Layout für bildreiche Inhalte. Wird von Erweiterungen wie Unsplash, Icon-Auswahl und Farbpaletten-Tools verwendet. Jedes Grid-Element kann ein Bild mit Titel und Untertitel anzeigen.

ActionPanel

Das Aktionsmenü, das erscheint, wenn ein Nutzer Enter oder Cmd+K bei einem Listenelement drückt. Aktionen können URLs öffnen, Text in die Zwischenablage kopieren, neue Ansichten öffnen, Funktionen ausführen und mehr. Hier finden die meisten Nutzerinteraktionen statt.

Einstellungen und Speicherung

Die API bietet ein Einstellungssystem für benutzerkonfigurierbare Einstellungen (API-Schlüssel, Standardoptionen) und eine lokale Speicher-API zum Persistieren von Daten zwischen Sitzungen. Einstellungen werden in package.json definiert und automatisch als Einstellungsformular in Raycast gerendert.

Der Raycast Store: Deine Erweiterung veröffentlichen

Der Raycast Store ist, wie Erweiterungen zu Nutzern gelangen. Das Veröffentlichen ist kostenlos, erfordert aber einen Überprüfungsprozess. So funktioniert es:

1. Das Extensions-Repository forken — alle Store-Erweiterungen befinden sich im raycast/extensions GitHub-Repo
2. Deine Erweiterung hinzufügen — lege dein Erweiterungsverzeichnis in den extensions/-Ordner
3. Einen Pull Request öffnen — reiche deine Erweiterung zur Überprüfung ein
4. Überprüfungsprozess — das Raycast-Team überprüft auf Qualität, Sicherheit und Einhaltung der Richtlinien (in der Regel 3–7 Werktage)
5. Veröffentlichung — nach der Genehmigung erscheint deine Erweiterung im Store für alle Raycast-Nutzer

Überprüfungsrichtlinien

Raycast hat klare Qualitätsstandards für Store-Erweiterungen:

• Die Erweiterung muss einem klaren Zweck dienen und zuverlässig funktionieren
• Code-Qualität ist wichtig — sauberes TypeScript, ordentliche Fehlerbehandlung, Ladezustände
• Die Benutzeroberfläche sollte Raycasts Design-Muster folgen (integrierte Komponenten verwenden, nicht gegen das Framework arbeiten)
• Kein bösartiges Verhalten, keine Datenerfassung, keine unnötigen Berechtigungen
• Gute Beschreibung, Screenshots und Dokumentation im README

Der Überprüfungsprozess ist gründlich, aber fair. Wenn Änderungen angefordert werden, geben die Prüfer klares Feedback. Die meisten Erweiterungen werden innerhalb einer Woche genehmigt.

Beispiele beliebter mit der API erstellter Erweiterungen

Um eine Vorstellung davon zu bekommen, was möglich ist, hier einige herausragende Erweiterungen aus dem Store:

• Brew — Homebrew-Pakete über Raycast suchen, installieren und verwalten. Demonstriert List mit Suche, Aktionen und Shell-Befehlsausführung.
• Notion — schnelles Erfassen in Notion-Datenbanken, Seiten suchen und neue Seiten erstellen. Zeigt Form-Nutzung und API-Integration.
• Spotify Player — vollständige Musiksteuerung mit Wiedergabe-Info in der Menüleiste. Demonstriert Menüleisten-Integration und Echtzeit-Updates.
• Clipboard History — eine von Raycasts integrierten Erweiterungen, die zeigt, wie List mit Abschnitten, Suche und Zwischenablagen-Aktionen zusammenwirken.
• Color Picker — systemweite Farbauswahl mit Formatkonvertierung. Zeigt, wie Erweiterungen auf macOS-Systemfunktionen zugreifen können.

Alle diese sind Open Source im raycast/extensions-Repository, du kannst also den Quellcode als Referenz und Inspiration lesen.

Tipps für großartige Erweiterungen

Einfach anfangen

Deine erste Erweiterung muss nicht komplex sein. Fange mit einem einzigen Befehl an, der ein Problem gut löst. Du kannst später immer weitere Befehle und Funktionen hinzufügen. Die besten Erweiterungen im Store tun oft eine Sache außergewöhnlich gut.

Laden und Fehler elegant behandeln

Verwende die isLoading-Prop für List- und Detail-Komponenten, um Ladeindikatoren anzuzeigen. Umhülle API-Aufrufe mit try-catch-Blöcken und zeige aussagekräftige Fehlermeldungen mit showToast() an. Nutzer sollten niemals einen leeren Bildschirm oder eine kryptische Fehlermeldung sehen.

TypeScript streng verwenden

Aktiviere den Strict-Modus in deiner tsconfig.json. Die Raycast API ist vollständig typisiert, und TypeScript fängt die meisten Fehler ab, bevor du die Erweiterung überhaupt ausführst. Die Autovervollständigung in VS Code ist ausgezeichnet, wenn Typen korrekt definiert sind.

Caching nutzen

Wenn deine Erweiterung Daten von einer API abruft, verwende Raycasts Cache-API, um Antworten lokal zu speichern. Das lässt die Erweiterung bei nachfolgenden Starts sofort reagieren, während neue Daten im Hintergrund geladen werden.

Bestehende Erweiterungen studieren

Der beste Weg, Muster zu lernen, ist das Lesen des Quellcodes etablierter Erweiterungen. Das raycast/extensions-Repo hat über 1.000 Erweiterungen zum Lernen. Finde eine ähnliche zu dem, was du baust, und studiere ihre Architektur.

Erweiterungen mit Raycast Pro-Funktionen erstellen

Wenn du ein Raycast Pro-Abonnent bist, können deine Erweiterungen zusätzliche Möglichkeiten nutzen. Raycast AI kann neben benutzerdefinierten Erweiterungen für intelligente Autovervollständigung, Inhaltsgenerierung und natürliche Sprachverarbeitung in deinen Tools verwendet werden. Cloud Sync stellt sicher, dass deine Erweiterungseinstellungen auf allen deinen Macs konsistent sind.

Erweiterungen zu erstellen ist auf jedem Plan kostenlos, aber sie mit Pro-Funktionen wie KI zu verwenden, bringt sie auf ein neues Niveau. Wenn du Pro noch nicht ausprobiert hast, erhalte 80 % Rabatt mit einer kostenlosen Testversion — das ist das beste aktuell verfügbare Angebot.

Für mehr darüber, was Raycast ist und wie es in die macOS-Produktivitätslandschaft passt, lies unseren Leitfaden zu Raycast.

Häufig gestellte Fragen

Muss ich React kennen, um Raycast-Erweiterungen zu erstellen?

Grundkenntnisse in React sind hilfreich, da Raycast-Erweiterungen React-Komponenten verwenden, aber du musst kein Experte sein. Die API bietet vorgefertigte UI-Komponenten — List, Detail, Form, ActionPanel — die den Großteil des Layouts und der Interaktion übernehmen. Wenn du JavaScript kennst und JSX-Syntax verstehst, kannst du schnell funktionierende Erweiterungen erstellen. Die offizielle Dokumentation enthält viele Copy-Paste-Beispiele zum Einstieg.

Wie läuft der Erweiterungsüberprüfungsprozess ab?

Nachdem du deine Erweiterung über einen Pull Request an das raycast/extensions GitHub-Repository eingereicht hast, prüft das Raycast-Team sie auf Qualität, Sicherheit und Einhaltung ihrer Richtlinien. Überprüfungen dauern in der Regel 3–7 Werktage. Das Team kann Änderungen anfragen — Feedback ist konstruktiv und spezifisch. Nach der Genehmigung wird deine Erweiterung im Raycast Store veröffentlicht und steht allen Nutzern zur Verfügung.

Kann ich Raycast-Erweiterungen monetarisieren?

Derzeit bietet Raycast keinen direkten Monetarisierungsmechanismus für Store-Erweiterungen. Alle veröffentlichten Erweiterungen sind für Nutzer kostenlos zu installieren. Du kannst jedoch Erweiterungen erstellen, die mit deinen bezahlten Diensten oder SaaS-Produkten integriert sind, um Erweiterungen als Distributionskanal zu nutzen. Einige Entwickler erstellen auch private, maßgeschneiderte Erweiterungen für Kunden als bezahlte Beratungsarbeit.

Ist die Raycast API kostenlos nutzbar?

Ja, vollständig. Die Raycast API, Entwicklungswerkzeuge, CLI-Scaffolding und Store-Veröffentlichung sind alle kostenlos. Du benötigst Raycast Pro nicht, um Erweiterungen zu entwickeln oder zu veröffentlichen — der kostenlose Plan beinhaltet vollständige Erweiterungsentwicklungsmöglichkeiten. Die einzigen Kosten, die dir entstehen könnten, hängen mit Drittanbieter-APIs zusammen, die deine Erweiterung integriert (wie OpenAI, Datenbanken usw.).