Mobiscroll MCP

npx add-mcp 'https://mcp.mobiscroll.com'

Mobiscroll liefert einen MCP-Server und Agent-Skills, damit Coding-Assistenten Scheduler-, Eventkalender-, Timeline- und Picker-Code korrekt generieren – für Claude Code, Codex, Cursor und GitHub Copilot, zusammen mit maschinenlesbarer Dokumentation und KI-Verhaltensregeln.

Warum KI-Integration?

KI-Coding-Assistenten funktionieren am besten, wenn sie Zugriff auf strukturierte, maßgebliche Dokumentation haben. Ohne diese neigen sie oft dazu:

• APIs zu halluzinieren – Optionsnamen, Events oder Typen zu erfinden, die nicht existieren
• Frameworks zu vermischen – Angular-Modul-Imports oder jQuery-Plugin-Syntax zu verwenden, statt React-Hooks und JSX
• Veraltete Versionen zu referenzieren – v5-Code zu generieren, wenn die aktuelle Version v6 ist
• Framework-Konventionen zu ignorieren – benannte Imports aus @mobiscroll/react auszulassen oder den CSS-Import zu überspringen

Die Mobiscroll-KI-Integration adressiert diese Probleme, indem sie für KI-Konsum optimierte Dokumentation bereitstellt, kombiniert mit Verhaltensregeln, die Framework-Isolation und korrekte API-Nutzung durchsetzen.

Architekturübersicht

Die Integration besteht aus drei Schichten:

Datenschicht – llms-Dateien

Maschinenlesbare Dokumentationsdateien mit der vollständigen Mobiscroll-API-Referenz und Anleitungen, eine pro Framework. Diese sind die Quelle der Wahrheit, die KI-Tools lesen, um Fragen zu beantworten.

Datei	Beschreibung
llms-react-full.txt	Vollständige React-Dokumentation
llms-react.txt	React-Inhaltsverzeichnis (Links zu einzelnen Seiten)
llms-icons.txt	Icon-Namen (IcoMoon, Font Awesome, Ionicons) – alle Frameworks

[!-info] -info info

Sie müssen diese Dateien nicht herunterladen oder hosten – die Regeldateien sowie die Claude-Code- und Codex-Plugins referenzieren sie direkt und rufen ihren Inhalt automatisch ab.

Regelschicht – Regeldateien

Regeldateien liefern Mobiscroll-Kontext nur für Cursor und GitHub Copilot. Claude Code und Codex verwenden stattdessen das Mobiscroll-Plugin – keine manuelle Dateieinrichtung erforderlich.

Zwei Ansätze sind verfügbar:

• Option A – dateibasiertes Kontextladen. Eine Regeldatei (.mdc für Cursor, .instructions.md für Copilot) enthält API-Dokumentation und Verhaltensregeln. Kein MCP-Server erforderlich.
• Option B – Live-Schema-Abruf über MCP-Server. Erweiterte Regeldateien weisen die KI an, den Mobiscroll-MCP-Server für Live-Komponenten-Schema-Abfragen bei jeder Generierung aufzurufen. Geeignet für interaktive Coding-Agenten, die Präzision pro Abfrage benötigen.

Wählen Sie basierend auf Ihrer Präferenz und Einrichtung.

Dateien

Option A – dateibasierte Regeln:

Datei	Format	Für
mobiscroll-react.mdc	Cursor-Regeldatei	Cursor
copilot-instructions/mobiscroll-react.instructions.md	Copilot-Anweisungsdatei	GitHub Copilot

Option B – erweiterte Regeln mit MCP:

Datei	Format	Für
mobiscroll-ui.mdc	Cursor-erweiterte Regel (Orchestrator)	Cursor
mobiscroll-ui-react.mdc	Cursor-erweiterte Regel (React)	Cursor
mobiscroll-ui-theming.mdc	Cursor-erweiterte Regel (Theming)	Cursor
mobiscroll-ui.instructions.md	Copilot-erweiterte Anweisung (Orchestrator)	GitHub Copilot
mobiscroll-ui-react.instructions.md	Copilot-erweiterte Anweisung (React)	GitHub Copilot
mobiscroll-ui-theming.instructions.md	Copilot-erweiterte Anweisung (Theming)	GitHub Copilot

Welches Tool verwendet welche Dateien?

Tool	Ansatz	Verwendete Dateien
Cursor	Option A	mobiscroll-react.mdc
Cursor	Option B	mobiscroll-ui.mdc, mobiscroll-ui-react.mdc, mobiscroll-ui-theming.mdc
GitHub Copilot	Option A	mobiscroll-react.instructions.md
GitHub Copilot	Option B	mobiscroll-ui.instructions.md, mobiscroll-ui-react.instructions.md, mobiscroll-ui-theming.instructions.md

Live-Schema-Schicht – MCP-Server

Der Mobiscroll-MCP-Server liefert strukturiertes, versionsgestempeltes API-Wissen über das Model Context Protocol. Es ist ein einzelner, einheitlicher Server: Derselbe mobiscroll-Server, der diese UI-Komponenten-Tools bereitstellt, bedient auch die Mobiscroll-Connect-Tools, mit dem Präfix Connect, sodass sie nie kollidieren. Statt sich auf Dokumentations-Snapshots zu verlassen, kann ein Assistent diese Tools aufrufen, um das exakte Komponenten-Schema, gültige Props/Events oder ein funktionierendes Beispiel zur Generierungszeit abzurufen – so halluziniert er nie oder weicht von der aktuellen API ab. Siehe die MCP-Tool-Referenz für die vollständige Liste dessen, was er bereitstellt.

Es ist ein gehosteter Streamable-HTTP-Server unter https://mcp.mobiscroll.com/ – keine lokale Installation erforderlich. Er ist optional für Cursor und GitHub Copilot (nur verwendet, wenn Sie Option B wählen) und gebündelt/immer aktiv für Claude Code und Codex über das Plugin.

Cursor-Einrichtung

Schritt 1: Dokumentationsquellen registrieren

Öffnen Sie Cursor-Einstellungen → Indizierung & Docs und fügen Sie die Dokumentationsquelle für Ihr Framework hinzu:

Framework	Name	URL
React	Mobiscroll React	https://mobiscroll.com/docs/llms-react-full.txt

Registrieren Sie nur die Quelle, die Ihrem Anwendungsfall entspricht. Registrieren Sie nicht mehrere Quellen – dies verhindert domänenübergreifende Kontamination.

Schritt 2: Verhaltensregeln hinzufügen

Wählen Sie einen Ansatz – Option A funktioniert sofort ohne zusätzliche Einrichtung; Option B fügt Live-MCP-Schema-Abfragen für höhere Genauigkeit hinzu, erfordert jedoch die Konfiguration des MCP-Servers.

Option A – .mdc-Regeldatei

Laden Sie die mobiscroll-react.mdc-Datei herunter und platzieren Sie sie in .cursor/rules/:

your-project/
├── .cursor/
│   └── rules/
│       └── mobiscroll-react.mdc
├── src/
└── package.json

Die .mdc-Datei bietet textbasierte API-Regeln – keine zusätzliche Einrichtung erforderlich.

Option B – Erweiterte Regeldateien + MCP (3 Dateien)

Laden Sie die drei erweiterten Regeldateien herunter und platzieren Sie sie in .cursor/rules/:

• mobiscroll-ui.mdc (Orchestrator)
• mobiscroll-ui-react.mdc (React-Konventionen)
• mobiscroll-ui-theming.mdc (Theming)

your-project/
├── .cursor/
│   └── rules/
│       ├── mobiscroll-ui.mdc
│       ├── mobiscroll-ui-react.mdc
│       └── mobiscroll-ui-theming.mdc
├── src/
└── package.json

Im Gegensatz zu Option A weisen diese Regeldateien Cursors KI an, den Mobiscroll-MCP-Server für Live-Komponenten-Schema-Abfragen bei jeder Generierung aufzurufen – so arbeitet sie mit der aktuellen API, statt aus dem Gedächtnis zu raten. Überprüfen Sie generierten Code vor dem Zusammenführen, wie bei jeder KI-Ausgabe.

Regelaktivierung

Die erweiterten .mdc-Dateien verwenden alwaysApply: false mit einem description in ihrem Frontmatter. Cursor liest die Beschreibung und aktiviert die Regel nur, wenn der Kontext relevant ist – die Regel wird nicht in jede Nachricht aufgenommen. Sie können sie auch manuell mit @rule-name auslösen (z. B. @mobiscroll-ui). Das .mdc-Format funktioniert in allen Cursor-Modi, einschließlich Agent-Modus.

Schritt 3: MCP-Server verbinden

Konfigurieren Sie den Mobiscroll-MCP-Server, damit die erweiterten Regeln ihn für Live-Schema-Abfragen aufrufen können.

Erstellen oder bearbeiten Sie .cursor/mcp.json in Ihrem Projektstamm:

{
  "mcpServers": {
    "mobiscroll": {
      "url": "https://mcp.mobiscroll.com/"
    }
  }
}

[!-warning] -warning Kein type-Feld

Cursor leitet den Transporttyp aus der URL ab. Fügen Sie nicht "type": "http" zu Cursors Konfiguration hinzu – dies verursacht einen Fehler.

your-project/
├── .cursor/
│   ├── mcp.json
│   └── rules/
│       ├── mobiscroll-ui.mdc
│       ├── mobiscroll-ui-react.mdc
│       └── mobiscroll-ui-theming.mdc
├── src/
└── package.json

Geltungsbereich	Konfigurationsdatei	Mit Team geteilt
Projekt	.cursor/mcp.json im Projektstamm	Ja, wenn eingecheckt
Global	~/.cursor/mcp.json	Nein, alle Ihre Projekte

Verbindung überprüfen: Öffnen Sie das Ausgabe-Panel in Cursor und wählen Sie MCP-Protokolle aus dem Dropdown. Eine erfolgreiche Verbindung protokolliert Tool-Erkennungsmeldungen für den mobiscroll-Server.

So funktioniert es

Wenn Sie Cursor nach Mobiscroll fragen, fügen Sie @docs hinzu, um sicherzustellen, dass er die registrierte Dokumentation liest:

@docs How do I set up a weekly scheduler with Mobiscroll?

@docs What options does the Eventcalendar timeline view accept?

GitHub-Copilot-Einrichtung

Schritt 1: Verhaltensregeln hinzufügen

Wählen Sie einen Ansatz – Option A funktioniert sofort ohne zusätzliche Einrichtung; Option B fügt Live-MCP-Schema-Abfragen für höhere Genauigkeit hinzu, erfordert jedoch die Konfiguration des MCP-Servers.

Option A – .instructions.md-Regeldatei

Laden Sie die mobiscroll-react.instructions.md-Datei herunter und platzieren Sie sie in .github/instructions/:

your-project/
├── .github/
|   └── instructions/
|       └── mobiscroll-react.instructions.md
├── src/
└── package.json

Die .instructions.md-Datei bietet textbasierte API-Regeln – keine zusätzliche Einrichtung erforderlich.

Option B – Erweiterte Anweisungsdateien + MCP (3 Dateien)

Laden Sie die drei erweiterten Anweisungsdateien herunter und platzieren Sie sie in .github/instructions/:

• mobiscroll-ui.instructions.md (Orchestrator)
• mobiscroll-ui-react.instructions.md (React-Konventionen)
• mobiscroll-ui-theming.instructions.md (Theming)

your-project/
├── .github/
|   └── instructions/
|       ├── mobiscroll-ui.instructions.md
|       ├── mobiscroll-ui-react.instructions.md
|       └── mobiscroll-ui-theming.instructions.md
├── src/
└── package.json

Schritt 2: MCP-Server verbinden

Konfigurieren Sie den Mobiscroll-MCP-Server, damit die erweiterten Anweisungsdateien ihn für Live-Schema-Abfragen aufrufen können.

Erstellen oder bearbeiten Sie .vscode/mcp.json in Ihrem Projektstamm:

{
  "servers": {
    "mobiscroll": {
      "type": "http",
      "url": "https://mcp.mobiscroll.com/"
    }
  }
}

[!-warning] -warning "servers" nicht "mcpServers"

VS Code verwendet "servers" als Stammschlüssel – nicht "mcpServers" wie Claude Code und Cursor. Die Verwendung des falschen Schlüssels bricht die Konfiguration stillschweigend ohne Fehlermeldung.

your-project/
├── .vscode/
│   └── mcp.json
├── .github/
│   └── instructions/
│       ├── mobiscroll-ui.instructions.md
│       ├── mobiscroll-ui-react.instructions.md
│       └── mobiscroll-ui-theming.instructions.md
├── src/
└── package.json

Geltungsbereich	Konfigurationsdatei	Mit Team geteilt
Arbeitsbereich	.vscode/mcp.json im Projektstamm	Ja, wenn eingecheckt
Benutzerprofil	Geöffnet über MCP: Benutzerkonfiguration öffnen	Nein, alle Ihre Arbeitsbereiche

Verbindung überprüfen: Öffnen Sie die Befehlspalette und führen Sie MCP: Server auflisten aus. Der mobiscroll-Server sollte mit verbundenem Status erscheinen. Beim ersten Verwenden erscheint ein Vertrauensdialog – genehmigen Sie ihn, um den Serverstart zu erlauben.

Alternativ öffnen Sie die Befehlspalette und führen Sie MCP: Server hinzufügen für eine geführte Einrichtung aus.

So funktioniert es

Die Anweisungsdateien mit applyTo: "**" werden automatisch auf alle Copilot-Chat-Abfragen angewendet – keine manuelle Referenz erforderlich. Beide Optionen enthalten:

• Dokumentations-URLs – weisen die KI auf die richtige Framework-Dokumentation hin
• Komponentenzuordnung – ordnen Benutzerabsichten (z. B. „Scheduler") den richtigen Mobiscroll-APIs zu
• Regeln – erzwingen korrekte Paketimporte, CSS-Laden und API-Nutzung
• Einschränkungen – verhindern frameworkübergreifendes Mischen und API-Halluzination

Stellen Sie Mobiscroll-Fragen direkt:

How do I set up a weekly scheduler with Mobiscroll?

What options does the Eventcalendar timeline view accept?

Claude-Code-Einrichtung

Installieren Sie das Mobiscroll-Plugin für Claude Code. Das Plugin bündelt Framework-Coding-Skills und den MCP-Server in einer einzigen Installation – keine projektspezifischen Konfigurationsdateien erforderlich.

Schritt 1: Marketplace registrieren

Führen Sie dies einmal in Claude Code aus, um den Mobiscroll-Plugin-Marketplace zu registrieren:

/plugin marketplace add acidb/mobiscroll-marketplace

Schritt 2: Plugin installieren

/plugin install mobiscroll@mobiscroll

[!-warning] -warning Plugin-Skills aktualisieren sich nicht automatisch

Die Installation des Plugins erstellt einen Snapshot seiner Skills – Claude Code zieht keine neueren von selbst, es sei denn, Sie aktivieren die automatische Aktualisierung für den Marketplace. Um jederzeit die neuesten zu erhalten, führen Sie /plugin marketplace update mobiscroll && /plugin update mobiscroll@mobiscroll und dann /reload-plugins aus.

Schritt 3: MCP-Server verbinden

Das Plugin bündelt den MCP-Server – für die meisten Einrichtungen ist keine separate Konfiguration erforderlich. Um ihn manuell zu konfigurieren oder mit Ihrem Team zu teilen:

claude mcp add --transport http mobiscroll https://mcp.mobiscroll.com/

[!-warning] -warning VS-Code-Erweiterung

Wenn Sie die Claude-Visual-Studio-Code-Erweiterung verwenden, wird der Server nicht angezeigt, es sei denn, er wird mit Projektbereich hinzugefügt. Siehe den nächsten Befehl unten.

Um den Server automatisch mit Ihrem Team zu teilen, verwenden Sie den Projektbereich:

claude mcp add --transport http --scope project mobiscroll https://mcp.mobiscroll.com/

Dies erstellt oder aktualisiert .mcp.json in Ihrem Projektstamm. Sie können diese Datei auch manuell erstellen:

{
  "mcpServers": {
    "mobiscroll": {
      "type": "http",
      "url": "https://mcp.mobiscroll.com/"
    }
  }
}

Geltungsbereich	CLI-Flag	Konfigurationsort	Mit Team geteilt
Lokal (Standard)	--scope local	~/.claude.json	Nein
Projekt	--scope project	.mcp.json im Projektstamm	Ja, über Versionskontrolle
Benutzer	--scope user	~/.claude.json	Nein, alle Ihre Projekte

[!-info] -info info

Verwenden Sie --scope project für Team-Repos, damit jeder den MCP-Server automatisch erhält, wenn er das Projekt klont. [!WARNING] -warning Auch aus dem Verzeichnis verbunden?

Wenn Ihre Organisation den Mobiscroll-Connector aus dem Anthropic-Verzeichnis aktiviert hat, haben Sie den Server möglicherweise bereits über Ihr Claude-Konto. Ein projektspezifischer .mcp.json-Eintrag und der Verzeichnis-Connector sind zwei Wege zu demselben Server, und Claude Code kann den Projekteintrag als fehlgeschlagen melden, bis Sie den Connector auf Ihrem eigenen Konto autorisieren. Autorisieren Sie ihn einmal, und beide funktionieren, oder entfernen Sie den .mcp.json-Eintrag und verlassen Sie sich nur auf den Connector. Siehe Claude-App-Einrichtung unten.

Verbindung überprüfen: Führen Sie /mcp in Claude Code aus. Das Panel listet jeden verbundenen Server und seine Tool-Anzahl auf. Eine gesunde Verbindung zeigt mobiscroll mit mindestens einem Tool.

So funktioniert es

Nach der Installation bietet das Plugin:

• Skills — mobiscroll-ui ist der Orchestrator-Skill, der Ihr Framework (React, Angular, Vue, JavaScript oder jQuery) erkennt und den passenden Framework-Unter-Skill lädt. Designfragen werden von mobiscroll-ui-theming übernommen. Alle Skills werden zusammen installiert.
• MCP-Server — Der gebündelte Mobiscroll-MCP-Server bietet Live-Komponenten-Schema-Abfragen, Code-Validierung und Beispielsuche auf Abruf, sodass Claude mit der aktuellen API arbeitet, anstatt aus dem Gedächtnis zu raten. Überprüfen Sie generierten Code vor dem Zusammenführen, wie bei jeder KI-Ausgabe.

Wenn Sie Claude Code bitten, Mobiscroll-Code zu schreiben, geht es wie folgt vor:

1. Erkennt Ihr Framework und die Mobiscroll-Version über resolveEnvironment
2. Lädt den passenden Framework-Skill mit idiomatischen Konventionen
3. Schlägt das Komponenten-Schema nach, bevor es Props oder Events schreibt
4. Validiert generierten Code, bevor er an Sie zurückgegeben wird

Codex-Einrichtung

Installieren Sie das Mobiscroll-Plugin für OpenAI Codex. Das Plugin bündelt Framework-Coding-Skills und den MCP-Server in einer einzigen Installation — keine projektspezifischen Konfigurationsdateien erforderlich.

Schritt 1: Marktplatz registrieren

Führen Sie dies einmal in Codex aus, um den Mobiscroll-Plugin-Marktplatz zu registrieren:

/plugins marketplace add acidb/mobiscroll-marketplace

Schritt 2: Plugin installieren

/plugins install mobiscroll@mobiscroll

[!WARNING] -warning Plugin-Skills aktualisieren sich nicht automatisch

Die Installation des Plugins erstellt eine Momentaufnahme seiner Skills — Codex zieht keine neueren von selbst. Um jederzeit die neuesten zu erhalten, aktualisieren Sie den Marktplatzkatalog und installieren Sie das Plugin neu: /plugins marketplace update mobiscroll, dann /plugins install mobiscroll@mobiscroll.

Schritt 3: MCP-Server verbinden

Das Plugin bündelt den MCP-Server — für die meisten Einrichtungen ist keine separate Konfiguration erforderlich. Um ihn manuell zu konfigurieren oder mit Ihrem Team zu teilen, fügen Sie ihn zu ~/.codex/config.toml (global) oder .codex/config.toml (Projekt) hinzu:

[mcp_servers.mobiscroll]
url = "https://mcp.mobiscroll.com/"

Sie können ihn auch über die Befehlszeile registrieren:

codex mcp add mobiscroll --url https://mcp.mobiscroll.com/

Bereich	Konfigurationsort	Mit Team geteilt
global	~/.codex/config.toml	Nein, alle Ihre Projekte
Projekt	.codex/config.toml im Projektstamm (nur vertrauenswürdige Projekte)	Ja, über Versionskontrolle

[!INFO] -info info

Verwenden Sie den projektbezogenen .codex/config.toml für Team-Repos, damit jeder den MCP-Server automatisch erhält, wenn er das Projekt klont.

Verbindung überprüfen: Führen Sie /mcp in Codex aus. Das Panel listet jeden verbundenen Server und seine Tool-Anzahl auf. Eine gesunde Verbindung zeigt mobiscroll mit seinen aufgelisteten Tools.

So funktioniert es

Nach der Installation bietet das Plugin:

• Skills — mobiscroll-ui ist der Orchestrator-Skill, der Ihr Framework (React, Angular, Vue, JavaScript oder jQuery) erkennt und den passenden Framework-Unter-Skill lädt. Designfragen werden von mobiscroll-ui-theming übernommen. Alle Skills werden zusammen installiert.
• MCP-Server — Der gebündelte Mobiscroll-MCP-Server bietet Live-Komponenten-Schema-Abfragen, Code-Validierung und Beispielsuche auf Abruf, sodass Codex mit der aktuellen API arbeitet, anstatt aus dem Gedächtnis zu raten. Überprüfen Sie generierten Code vor dem Zusammenführen, wie bei jeder KI-Ausgabe.

Wenn Sie Codex bitten, Mobiscroll-Code zu schreiben, geht es wie folgt vor:

1. Erkennt Ihr Framework und die Mobiscroll-Version über resolveEnvironment
2. Lädt den passenden Framework-Skill mit idiomatischen Konventionen
3. Schlägt das Komponenten-Schema nach, bevor es Props oder Events schreibt
4. Validiert generierten Code, bevor er an Sie zurückgegeben wird

Claude-App-Einrichtung — claude.ai, Desktop und mobil

Der MCP-Server ist im Connector-Verzeichnis von Anthropic veröffentlicht, sodass Claude im Web, Claude Desktop und die Claude-Mobil-Apps ihn ohne Projektdateien oder CLI-Befehle verwenden können. Es ist derselbe Server, den die Editor-Einrichtungen oben verwenden — der Unterschied liegt nur darin, wie Sie ihn erreichen.

Schritt 1: Aus dem Verzeichnis verbinden

Öffnen Sie Einstellungen → Connectors → Connectors durchsuchen, suchen Sie nach Mobiscroll und klicken Sie auf Verbinden.

Es gibt nichts zu konfigurieren. Der Server ist schreibgeschützt und benötigt kein Konto, keinen API-Schlüssel und keine OAuth-Anmeldung.

Schritt 2: Für Ihre Organisation aktivieren (Team und Enterprise)

Bei Team- und Enterprise-Plänen fügt ein Besitzer den Connector zuerst für die Organisation hinzu. Jedes Mitglied verbindet ihn dann auf seinem eigenen Konto — der Connector wird für alle aufgelistet, antwortet aber erst, wenn das einzelne Mitglied ihn verbunden hat.

[!WARNING] -warning Bereits als benutzerdefinierten Connector hinzugefügt?

Wenn Sie mobiscroll von Hand hinzugefügt haben, bevor er im Verzeichnis war, entfernen Sie diesen Eintrag, bevor Sie sich aus dem Verzeichnis verbinden. Zwei Einträge, die auf https://mcp.mobiscroll.com/ verweisen, registrieren dieselben Tools zweimal, und Claude könnte die Kopie aufrufen, die Sie nicht erwarten.

Öffnen Sie Einstellungen → Connectors, finden Sie Ihren benutzerdefinierten mobiscroll-Eintrag und entfernen Sie ihn. Verbinden Sie sich dann aus dem Verzeichnis.

So funktioniert es

Claude ruft dieselben 14 schreibgeschützten Tools auf, die in der MCP-Tool-Referenz unten aufgeführt sind. Fragen Sie nach den Optionen einer Komponente, einer Event-Signatur, einem Connect-Endpunkt oder dem SDK-Äquivalent eines REST-Aufrufs, und es liest das aktuelle Schema, anstatt aus dem Gedächtnis zu antworten.

Der Verzeichnis-Connector enthält keine Skills. Diese sind Teil der Claude-Code- und Codex-Plugins — um Mobiscroll-Code in einem Projekt zu schreiben, verwenden Sie die Claude-Code-Einrichtung oben.

MCP-Tool-Referenz

Der MCP-Server stellt 14 Tools bereit. Alle sind schreibgeschützt und als solche gekennzeichnet, sodass ein KI-Assistent sie ohne jedes Mal eine Bestätigung anzufordern aufrufen kann. Keines davon liest oder schreibt etwas in Ihrem Mobiscroll-Konto, und die Connect-Tools beschreiben die Connect-API, anstatt sie aufzurufen.

Mobiscroll-UI-Tools

Tool	Was es zurückgibt	Erfordert
resolveEnvironment	Das Framework und die Hauptversion, die ein Projekt verwendet, gelesen aus seiner package.json. Dies sind die Werte, die die anderen UI-Tools als Argumente annehmen.	package.json-Inhalt
listComponents	Jede Komponente, die für ein Framework und eine Version verfügbar ist, mit einer kurzen Beschreibung und Entitätsanzahl.	Framework, Hauptversion
getComponentSchema	Optionen, Events, Methoden und Renderer für eine Komponente. Gibt zuerst einen kompakten Index zurück; rufen Sie erneut mit spezifischen Namen für vollständige Details auf.	Komponente, Framework, Hauptversion
searchExamples	Beispiele, die Schlüsselwörtern entsprechen, nach Komponente und Version gefiltert, nach Relevanz sortiert.	Framework, Hauptversion
getExampleById	Ein vollständiges Beispiel mit seinen Quelldateien, Beschreibung und Implementierungshinweisen.	exampleId, Framework, Hauptversion
validateCode	Unbekannte Props, Events und Methoden in einem Ausschnitt sowie veraltete Verwendung. Statische Analyse — nichts wird ausgeführt.	Komponente, Framework, Hauptversion, Ausschnitt

Mobiscroll-Connect-Tools

Derselbe Server beantwortet auch Fragen zur Connect-REST-API und ihren SDKs. Diese sind vollständig im Connect-AI-Integrationsleitfaden dokumentiert.

Tool	Was es zurückgibt	Erfordert
resolveConnectEnvironment	Welches Connect-SDK und welche Version ein Projekt verwendet, gelesen aus seinem Abhängigkeitsmanifest.	Manifestinhalt
listConnectEndpoints	Jeder Connect-REST-Endpunkt mit seiner Methode, seinem Pfad, seiner Zusammenfassung und Authentifizierung.	—
getConnectEndpointSchema	Ein Endpunkt vollständig: Parameter mit Typen, Authentifizierung, Antwortstatus, Beispiele.	endpointId oder Methode + Pfad
listConnectSdkMethods	Die Ressourcen und Methoden, die das SDK einer Sprache bereitstellt.	Sprache
getConnectSdkMethod	Eine SDK-Methode vollständig: Signatur, Parameter, Rückgabetyp, Dokumentationskommentar, Beispiel.	Sprache, Methode
searchConnect	Schlüsselwortübereinstimmungen über REST-Endpunkte und SDK-Methoden hinweg.	Abfrage
mapConnectEndpointToSdk	Der äquivalente SDK-Aufruf für einen REST-Endpunkt, in jeder Sprache oder einer.	endpointId oder Methode + Pfad
getConnectErrorTaxonomy	Jede Fehlerkategorie mit ihrem HTTP-Status und dem idiomatischen Ausnahmetyp pro Sprache.	—

[!SUCCESS] -success Beginnen Sie mit einem resolve-Aufruf

Der Server läuft remote und kann Ihre Dateien nicht lesen, daher akzeptieren resolveEnvironment und resolveConnectEnvironment Ihren Manifestinhalt als Argument. Jedes andere Tool akzeptiert das Framework, die Version oder die Sprache direkt, wenn Sie sie bereits kennen.

Framework-Isolation

[!WARNING] -warning Kritisch

Jede Regeln-Datei und Dokumentationsquelle zielt auf genau ein Framework oder eine Domäne. Kombinieren Sie niemals Dateien aus verschiedenen Frameworks oder mischen Sie UI-Framework-Dateien mit Connect-Dateien.

Warum das wichtig ist:

• Die meisten API-Optionen werden über Frameworks hinweg geteilt, aber die Komponentennutzung und das Templating unterscheiden sich für jedes — das Mischen erzeugt kaputten Code

Mobiscroll Connect ist eine separate Domäne:

• Connect ist eine Backend-Integrationsschicht — OAuth 2.0, REST-API, Webhooks, Kalendersynchronisierung
• Es hat keine UI-Komponenten, kein JSX, keine Frontend-Framework-Bindungen
• Connect verwendet mobiscroll-connect.mdc und llms-connect-full.txt — niemals die UI-Framework-Dateien
• Das Mischen von Connect-Dokumenten mit UI-Dokumenten führt dazu, dass die KI REST-Endpunkte mit Komponenten-APIs verwechselt

[!INFO] -info info

Das mobiscroll@mobiscroll-Plugin bündelt auch einen mobiscroll-connect-Skill für serverseitiges Connect (OAuth, REST, Kalendersynchronisierung). Er aktiviert sich nur für Backend-Connect-Arbeit und mischt sich nie mit UI-Komponentencode. Siehe den Connect-AI-Integrationsleitfaden.

Regeln:

1. Verwenden Sie nur Regeln-Dateien, die einem Framework oder einer Domäne entsprechen — mischen Sie niemals Dateien aus verschiedenen Frameworks
2. Registrieren Sie nur eine Dokumentationsquelle in Cursor
3. Wenn Ihr Projekt mehrere Frameworks verwendet (z. B. Micro-Frontends), richten Sie separate Verzeichnisse mit separaten .mdc-Dateien ein
4. Wenn Ihr Projekt sowohl ein UI-Framework als auch Mobiscroll Connect verwendet, verwenden Sie separate KI-Kontextverzeichnisse für jedes
5. Wenn ein KI-Assistent Code mit falschen Framework-Importen generiert, überprüfen Sie, ob die richtige Regeln-Datei vorhanden ist

Beispielabfragen

Diese Beispiele zeigen die Art von Fragen, die die KI-Integration korrekt verarbeiten soll.

How do I create an Eventcalendar with a weekly scheduler view?
Add drag and drop support to my Mobiscroll timeline.
What is the type for calendar events in Mobiscroll React?

Fehlerbehebung

KI generiert Code mit dem falschen Framework

Symptom: Sie verwenden React, aber die KI generiert Code für ein anderes Framework (z. B. import { Eventcalendar } from '@mobiscroll/angular').

Behebung: Stellen Sie sicher, dass die richtige Regeln-Datei vorhanden ist. Für React in Cursor verwenden Sie mobiscroll-react.mdc; für Copilot verwenden Sie mobiscroll-react.instructions.md. In Cursor überprüfen Sie, ob die registrierte @docs-Quelle auf llms-react-full.txt verweist.

KI erfindet nicht existierende APIs

Symptom: Die KI schlägt Optionen, Events oder Typen vor, die in der Mobiscroll-Dokumentation nicht existieren.

Behebung: Die .mdc-Regeln weisen die KI an, nur APIs aus den Dokumenten zu verwenden. Wenn dies weiterhin passiert, verweisen Sie explizit auf @docs in Cursor-Abfragen oder überprüfen Sie, ob das Mobiscroll-Plugin in Claude Code (/plugin list) oder Codex (codex plugin list) installiert ist. Sie können die KI auch bitten, zu überprüfen, ob eine Option in der Mobiscroll-Dokumentation existiert.

KI mischt Mobiscroll Connect mit UI-Komponenten

Symptom: Die KI generiert REST-API-Aufrufe, wenn Sie nach einer Frontend-Kalenderkomponente gefragt haben, oder generiert JSX-/Komponentencode, wenn Sie nach der Connect-API gefragt haben. Fix: Mobiscroll Connect ist eine Backend-Integrationsschicht (OAuth, REST, Webhooks) und besitzt keine UI-Komponenten. Eventcalendar ist eine Frontend-UI-Komponente ohne REST-API. Sie verwenden vollständig getrennte .mdc-Dateien und Dokumentationsquellen. Stellen Sie sicher, dass die korrekte .mdc-Datei für Ihr Projekt aktiv ist. Wenn Sie beide im selben Codebase verwenden, halten Sie für jede separate AI-Kontextverzeichnisse bereit.

MCP-Server erscheint nach der Einrichtung nicht

Symptom: Das MCP-Server-Panel zeigt keinen mobiscroll-Eintrag, oder die Tools sind nicht verfügbar.

Fix: Überprüfen Sie, dass sich die Konfigurationsdatei am richtigen Speicherort befindet und den richtigen Root-Schlüssel verwendet — mcpServers für Claude Code, Codex und Cursor, servers für VS Code. Validieren Sie, dass die Datei wohlgeformtes JSON ist. Führen Sie für Claude Code oder Codex /mcp aus, um verbundene Server zu überprüfen.

Dateireferenz

Alle AI-Integrationsdateien sind unter den folgenden URLs verfügbar:

Dokumentationsdateien

Datei	URL
React	https://mobiscroll.com/docs/llms-react-full.txt

Regeln-Dateien

Datei	Cursor (.mdc)	Copilot (.instructions.md)
React-Regeln	mobiscroll-react.mdc	copilot-instructions/mobiscroll-react.instructions.md

Erweiterte Regeln-Dateien

Datei	Cursor (.mdc)	Copilot (.instructions.md)
Orchestrator	mobiscroll-ui.mdc	copilot-instructions/mobiscroll-ui.instructions.md
React-Konventionen	mobiscroll-ui-react.mdc	copilot-instructions/mobiscroll-ui-react.instructions.md
Theming	mobiscroll-ui-theming.mdc	copilot-instructions/mobiscroll-ui-theming.instructions.md

Dateiinhalte

Die vollständigen Inhalte jeder Datei sind unten aufgeführt. Sie können direkt aus diesen Blöcken kopieren oder die oben genannten Download-Links verwenden.