Come configurare il server ExodeUI MCP in Cursor
Configurazione dettagliata per il server ExodeUI MCP in Cursor (e Claude Code): la voce mcp.json, controllo degli strumenti, prime istruzioni e revisione sicura.
Punto chiave
Aggiungi una voce al file .cursor/mcp.json del tuo progetto che esegue il pacchetto claude-exode-mcp con npx, ricarica Cursor e controlla che il server exode e i suoi strumenti appaiano nelle impostazioni MCP di Cursor. Quindi chiedi all'agente di Cursor di creare o modificare un'animazione in un linguaggio semplice e di rivedere il risultato nell'editor ExodeUI prima della spedizione.
Di cosa hai bisogno
Cursor, Node.js (quindi npx è disponibile) e un account ExodeUI se desideri aprire i risultati nell'editor. Il server ExodeUI MCP è pubblicato su npm come claude-exode-mcp; funziona localmente tramite npx, quindi non c'è nient'altro da installare manualmente.
Passaggio 1: aggiungi il server a mcp.json
Cursor legge i server MCP personalizzati da un file mcp.json; un file a livello di progetto si trova in .cursor/mcp.json nel tuo repository. I server della riga di comando locali utilizzano il tipo "stdio" con un comando e argomenti. La voce per ExodeUI esegue npx con il pacchetto claude-exode-mcp (vedere il blocco di codice di seguito).
Passaggio 2: ricaricare e controllare gli strumenti
Ricarica Cursor, apri le sue impostazioni MCP e conferma che il server exode è in esecuzione e che i suoi strumenti sono elencati. Se non si avvia, controlla che npx funzioni nel tuo terminale e che la versione di Node.js sia aggiornata.
Passaggio 3: richiesta
Chiedi in un linguaggio semplice e sii specifico riguardo agli stati e alle sensazioni:
- "Crea un interruttore con gli stati di attivazione e disattivazione e una molla morbida tra di loro."
- "Aggiungi uno stato di caricamento al pulsante di salvataggio che pulsa delicatamente, quindi un controllo di successo."
- "Rendi più veloce l'animazione del successo e riduci il superamento."
Usando invece Claude Code
In Claude Code, aggiungi lo stesso server con un comando: claude mcp add exode npx -y claude-exode-mcp. Claude Code supporta anche la configurazione a livello di progetto in un file .mcp.json.
Rivedi prima di spedire
Anche un agente in grado di modificare i file può commettere errori. Mantieni i file .exode in Git in modo che le modifiche siano diffabili, apri i risultati nell'editor ExodeUI per controllare i tempi e ogni stato e testare il comportamento a movimento ridotto.
Estratto di implementazione in produzione
// .cursor/mcp.json
{
"mcpServers": {
"exode": {
"type": "stdio",
"command": "npx",
"args": ["-y", "claude-exode-mcp"]
}
}
}
# Claude Code alternative
claude mcp add exode npx -y claude-exode-mcpPrincipi chiave da ricordare
- Il server è il pacchetto npm claude-exode-mcp, eseguito con npx
- In Cursor, aggiungilo a .cursor/mcp.json come server stdio
- Ricarica e verifica che gli strumenti vengano visualizzati nelle impostazioni MCP
- Promuovere stati e sensazioni; sintonizzare i numeri in seguito
- Mantieni i file in Git e rivedi le modifiche nell'editor
Domande frequenti
Fonti
- claude-exode-mcp — npm
- Model Context Protocol (MCP) — Cursor documenti
- Connect Claude Code to tools via MCP — Claude Code documenti