DevCDP
Server MCP di Dayananda-D
Ispeziona ed esegui il debug di pagine web tramite Chrome DevTools: console, rete, DOM, source map, breakpoint e variabili live.
Installa DevCDP
Gira sul tuo computer. Il tuo client lo avvia con questo comando:
Richiede Node.js sul tuo computer. I passaggi qui sotto mostrano dove va il comando in ogni client.
DEVCDP_CHROME_PATHfacoltativo Path to the Chrome executable, when it is not on the default install path.DEVCDP_LOG_LEVELfacoltativo Server log verbosity on stderr: debug, info, warn or error.
Condividi questo server
Apre questa pagina, con il comando di installazione e i passaggi di configurazione.
mcp.tc/i/devcdpDescrizione
DevCDP offre a un assistente AI l’accesso a Chrome DevTools. Secondo la descrizione nel registry, copre la console, l’attività di rete, il DOM, le source map, i breakpoint e le variabili live, così l’assistente può fare il debug di una pagina in esecuzione con dati reali del browser.
Funziona in locale tramite stdio e si avvia con npx dal pacchetto npm devcdp. Non serve alcuna chiave API. Chrome deve essere installato. Se non si trova nel percorso predefinito, imposta DEVCDP_CHROME_PATH. DEVCDP_LOG_LEVEL controlla il livello di dettaglio dei log su stderr.
Cosa puoi fare
- Leggere l’output della console del browser
- Ispezionare l’attività di rete
- Ispezionare il DOM
- Lavorare con le source map
- Usare i breakpoint e leggere le variabili live
Tool
I server locali mostrano i loro tool solo quando sono in esecuzione, e questo non pubblica l’elenco in anticipo. Il tuo client li mostra dopo che lo hai aggiunto.
Prompt di esempio
Controlla la console del browser per errori in questa pagina.
Mostrami le richieste di rete fallite nella pagina che ho aperto.
Imposta un breakpoint nel mio handler di checkout e mostrami le variabili live.
Ispeziona il DOM del modulo di accesso e dimmi perché il pulsante è nascosto.
Configurazione
Ogni client avvia DevCDP sul tuo computer con lo stesso comando. Scegli il tuo; la pagina ricorda la tua scelta.
Claude Code
- Eseguilo in un terminale, nella cartella del tuo progetto:
claude mcp add --transport stdio devcdp -- npx -y devcdp- Avvia Claude Code e digita
/mcp. devcdp dovrebbe risultare collegato.
Aggiungi --scope user per renderlo disponibile in tutti i progetti.
Claude Desktop
- Apri Settings → Developer → Edit Config. Si apre
claude_desktop_config.json. Aggiungi:
{
"mcpServers": {
"devcdp": {
"command": "npx",
"args": [
"-y",
"devcdp"
]
}
}
}- Salva il file e riavvia Claude Desktop.
Richiede Node.js sul tuo computer. Il file si trova in ~/Library/Application Support/Claude/ su macOS e in %APPDATA%\Claude\ su Windows.
Cursor
Aggiungi a Cursor (si apre in una nuova scheda)
Oppure aggiungilo a mano in ~/.cursor/mcp.json (tutti i progetti) o in .cursor/mcp.json (questo progetto):
{
"mcpServers": {
"devcdp": {
"command": "npx",
"args": [
"-y",
"devcdp"
]
}
}
}Richiede Node.js sul tuo computer.
VS Code
Installa in VS Code (si apre in una nuova scheda)
Oppure da un terminale:
code --add-mcp '{"name":"devcdp","type":"stdio","command":"npx","args":["-y","devcdp"]}'Oppure fai commit nel repository in .vscode/mcp.json:
{
"servers": {
"devcdp": {
"type": "stdio",
"command": "npx",
"args": [
"-y",
"devcdp"
]
}
}
}Richiede Node.js sul tuo computer.
Devin Desktop
- Aggiungilo a
~/.config/devin/mcp_config.json(macOS e Linux) o a%APPDATA%\devin\mcp_config.json(Windows):
{
"mcpServers": {
"devcdp": {
"command": "npx",
"args": [
"-y",
"devcdp"
]
}
}
}- Aggiorna l’elenco dei server MCP in Cascade.
Devin Desktop è il nuovo nome di Windsurf.
Codex
codex mcp add devcdp -- npx -y devcdpOppure modifica direttamente ~/.codex/config.toml:
[mcp_servers.devcdp]
command = "npx"
args = ["-y", "devcdp"]Richiede Node.js sul tuo computer.
Gemini CLI
gemini mcp add devcdp npx -- -y devcdpCosì lo aggiungi al progetto corrente. Aggiungi -s user per usarlo ovunque.
Qualsiasi client
La maggior parte dei client che avviano server locali accetta questa forma:
{
"mcpServers": {
"devcdp": {
"command": "npx",
"args": [
"-y",
"devcdp"
]
}
}
}Zed mette i server sotto context_servers nelle sue impostazioni, con gli stessi campi command, args ed env.
Richiede Node.js sul tuo computer.
Embed
Mostra DevCDP in un README o sul tuo sito. Ogni embed rimanda a questa pagina, usa il comando di installazione del server e non imposta cookie. Come funzionano gli embed
Card, iframe e JSON sono in inglese. Aggiungi ?lang=it, fr, de o es al loro indirizzo per un’altra lingua.
Badge per il README
[](https://mcp.tc/i/devcdp)<a href="https://mcp.tc/i/devcdp"><img src="https://mcp.tc/i/devcdp/badge.svg" alt="DevCDP on mcp.tc" height="20"></a>Segue la modalità chiara o scura di chi legge. Aggiungi ?theme=light o ?theme=dark per fissarla, oppure ?style=compact per mostrare il simbolo senza la scritta.
Card per il sito
<script src="https://mcp.tc/w/devcdp.js" async></script>La card compare dove si trova il tag. Aggiungi data-theme="dark" o data-size="compact" al tag per cambiarla. Il file contiene tutto ciò che serve, quindi non fa altre richieste e non imposta cookie.
iframe
<iframe src="https://mcp.tc/embed/devcdp" title="DevCDP on mcp.tc" width="420" height="200" loading="lazy" allow="clipboard-write" style="border:0;border-radius:8px;max-width:100%"></iframe>Usalo nelle pagine che non consentono script. Aggiungi ?theme=light o ?theme=dark all’indirizzo per fissare i colori.
JSON
La scheda come dati per le tue pagine e i tuoi strumenti: nome, descrizione breve, comando di installazione, tool e i link «Add to». Qualsiasi sito può leggerla (CORS aperto).
https://mcp.tc/i/devcdp.jsonPrompt per l’AI
Incollalo in un assistente di programmazione con l’AI, come Claude Code o Cursor, e aggiungerà la card di DevCDP al tuo sito.
Aggiungi al mio sito la card di mcp.tc per DevCDP, un server MCP. È un solo script statico: niente build, nessun pacchetto da installare, nessun cookie.
Metti questo tag dove deve comparire la card. La card appare subito prima del tag:
```html
<script src="https://mcp.tc/w/devcdp.js" async></script>
```
Per mostrarla altrove, metti lì questo segnaposto e carica lo stesso script una volta sola, per esempio prima di `</body>`. Lascia il link al suo interno: lo vede chi non ha JavaScript.
```html
<div data-mcptc="devcdp"><a href="https://mcp.tc/i/devcdp">DevCDP on mcp.tc</a></div>
```
Opzioni:
- `data-theme="light"` o `"dark"` sul tag o sul segnaposto fissa i colori. Senza l’attributo, la card segue la modalità chiara o scura di chi visita.
- `data-size="compact"` dà una card più piccola, senza la descrizione breve.
- La variabile CSS `--mcptc-max-width` sul segnaposto o su un elemento padre imposta la larghezza (predefinita `520px`).
- `?lang=` nell’URL dello script imposta la lingua della card: `en`, `it`, `fr`, `de` o `es`.
Se il sito ha una Content Security Policy, consenti `script-src https://mcp.tc` e `img-src data:` (l’icona è inline).
Per un README o altra documentazione in Markdown, usa invece il badge:
```markdown
[](https://mcp.tc/i/devcdp)
```
Riferimento: https://mcp.tc/it/embedCronologia delle modifiche
Questo server gira sul tuo computer, quindi seguiamo il suo pacchetto npm: qui compare ogni nuova versione, insieme alle modifiche di chi lo gestisce.
Domande frequenti
Posso incollare mcp.tc/i/devcdp nel mio client MCP?
No. DevCDP gira sul tuo computer, avviato dal tuo client, quindi non ha un indirizzo web a cui collegarsi. Il link rapido è la pagina da condividere; il comando di installazione è npx -y devcdp.
DevCDP richiede una chiave API?
No. Non dichiara chiavi né variabili d’ambiente. Gira con i permessi del tuo account utente, quindi controlla cosa possono raggiungere i suoi tool.
DevCDP è un server remoto o locale?
Locale. Il tuo client lo avvia come processo sul tuo computer con npx -y devcdp, che richiede Node.js.
Cosa può fare DevCDP?
Puoi leggere l’output della console del browser, ispezionare l’attività di rete e ispezionare il DOM.
Quali client possono usarlo?
Qualsiasi client che avvia server locali: Claude Code, Claude Desktop, Cursor, VS Code, Devin Desktop, Codex, Gemini CLI, Zed e altri. claude.ai e ChatGPT si collegano solo a server remoti.
mcp.tc tiene traccia delle modifiche di DevCDP?
In parte. Gira sul tuo computer, quindi seguiamo il suo pacchetto npm: la sua sezione Cronologia mostra ogni nuova versione e le modifiche di chi lo gestisce. Segui la scheda per ricevere un’email quando cambia.
Chi ha scritto questa pagina?
Il robot di mcp.tc ha letto i metadati pubblici di DevCDP (le pagine del suo pacchetto e del repository), e un modello di AI ne ha ricavato il testo. Una persona esamina tutto ciò che i controlli non riescono a confermare. Il testo può comunque contenere errori, quindi se ne trovi uno usa Segnala questa scheda su questa pagina. Questa traduzione è stata fatta da un modello di AI a partire dal testo inglese.
mcp.tc non è affiliato a Dayananda-D. Questa pagina è stata creata a partire dai metadati pubblici di DevCDP (ultimo controllo: 5 ott 2026), e la descrizione l’ha scritta un modello di AI, quindi può contenere errori. Nomi e marchi appartengono ai rispettivi titolari. Qualcosa non va? Segnala questa scheda. La traduzione è stata fatta da un modello di AI a partire dal testo inglese.