Copilot Edits e Agent Mode: Editing Multi-File e Sviluppo Autonomo nell'IDE
Fino ad ora abbiamo esplorato Copilot come assistente per suggerimenti inline e come agente autonomo che lavora su GitHub. Esiste però un territorio intermedio estremamente potente: Copilot Edits e Agent Mode, che portano le capacità di editing multi-file e di esecuzione autonoma direttamente nel tuo IDE. Invece di modificare un file alla volta, puoi descrivere un cambiamento che coinvolge più file e lasciare che Copilot coordini tutte le modifiche in modo coerente.
In questo articolo esploreremo in dettaglio le modalità di editing avanzato disponibili: Edit Mode per modifiche multi-file guidate, Agent Mode per esecuzione autonoma con self-healing, Plan Mode per pianificazione prima dell'azione, e Next Edit Suggestions (NES) per un flusso di editing predittivo e fluido.
Panoramica della Serie
| # | Articolo | Focus |
|---|---|---|
| 1 | Foundation e Mindset | Setup e mentalità |
| 2 | Ideazione e Requisiti | Da idea a MVP |
| 3 | Architettura Backend | API e database |
| 4 | Struttura Frontend | UI e componenti |
| 5 | Prompt Engineering | Prompt e Agenti MCP |
| 6 | Testing e Qualità | Unit, integration, E2E |
| 7 | Documentazione | README, API docs, ADR |
| 8 | Deploy e DevOps | Docker, CI/CD |
| 9 | Evoluzione | Scalabilità e manutenzione |
| 10 | Coding Agent | Sviluppo autonomo |
| 11 | Code Review Automatica | Review AI-powered |
| 12 | Sei qui → Edits e Agent Mode | Editing multi-file |
| 13 | GitHub Spark | Micro-app AI-native |
| 14 | Copilot Spaces | Contesto condiviso |
| 15 | Modelli AI | Multi-model e selezione |
| 16 | Personalizzazione | Custom instructions |
| 17 | Enterprise | Adozione organizzativa |
| 18 | Estensioni | Copilot Extensions |
| 19 | Sicurezza | Security e compliance |
Le Modalità di Editing di Copilot
Copilot offre diverse modalità di interazione nell'IDE, ciascuna progettata per un livello diverso di autonomia e complessità. Comprendere le differenze è fondamentale per scegliere la modalità giusta per ogni situazione.
Confronto delle Modalità di Editing
| Modalità | Autonomia | Scope | IDE Supportati | Caso d'Uso |
|---|---|---|---|---|
| Inline Suggestions | Minima | Riga/blocco corrente | Tutti | Completamento codice in tempo reale |
| Edit Mode | Media | File specificati | VS Code, Visual Studio, JetBrains | Modifiche coordinate su più file selezionati |
| Agent Mode | Alta | Intero progetto | VS Code, Visual Studio, JetBrains | Task autonomi con self-healing |
| Plan Mode | Controllata | Intero progetto | VS Code, JetBrains, Eclipse, Xcode | Pianificazione prima dell'esecuzione |
| Coding Agent | Massima | Repository completo | GitHub (cloud) | Task completamente autonomi (PR) |
Copilot Edits: Editing Multi-File
Copilot Edits è la modalità che permette di descrivere un cambiamento in linguaggio naturale e applicarlo contemporaneamente a più file. A differenza dei suggerimenti inline che operano sul contesto immediato, Edits prende in considerazione la relazione tra i file selezionati e genera modifiche coerenti.
Workflow di Copilot Edits
- Seleziona i file: Aggiungi al contesto di Copilot i file che devono essere modificati
- Descrivi il cambiamento: Spiega in linguaggio naturale cosa vuoi ottenere
- Rivedi le modifiche: Copilot mostra un diff per ogni file con le modifiche proposte
- Itera: Se le modifiche non sono perfette, raffina la richiesta
- Applica: Accetta le modifiche che ritieni corrette, rifiuta le altre
Come Accedere a Copilot Edits
Attivazione nelle Diverse IDE
| IDE | Shortcut | Menu | Note |
|---|---|---|---|
| VS Code | Ctrl+Shift+I (Win/Linux) / Cmd+Shift+I (Mac) |
View > Copilot Edits | Pannello dedicato nel sidebar |
| Visual Studio | Ctrl+Shift+. |
Edit > Copilot Edits | Integrato nel pannello Copilot Chat |
| JetBrains | Ctrl+Shift+I |
Tools > Copilot > Edits | IntelliJ IDEA, WebStorm, PyCharm, etc. |
Esempio Pratico: Refactoring Multi-File
Immaginiamo di voler estrarre la logica di validazione da un controller in un middleware dedicato, aggiornando contemporaneamente il controller, le route e i test.
// File: src/controllers/user.controller.ts (PRIMA)
import {{ '{' }} Request, Response } from 'express';
import {{ '{' }} UserService } from '../services/user.service';
export class UserController {{ '{' }}
constructor(private userService: UserService) {{ '{' }}}
async createUser(req: Request, res: Response) {{ '{' }}
// Validazione inline nel controller
const {{ '{' }} email, name, password } = req.body;
if (!email || !email.includes('@')) {{ '{' }}
return res.status(400).json({{ '{' }} error: 'Invalid email' });
}
if (!name || name.length < 2) {{ '{' }}
return res.status(400).json({{ '{' }} error: 'Name too short' });
}
if (!password || password.length < 8) {{ '{' }}
return res.status(400).json({{ '{' }} error: 'Password too short' });
}
const user = await this.userService.create({{ '{' }} email, name, password });
res.status(201).json(user);
}
async updateUser(req: Request, res: Response) {{ '{' }}
const {{ '{' }} id } = req.params;
const {{ '{' }} email, name } = req.body;
if (email && !email.includes('@')) {{ '{' }}
return res.status(400).json({{ '{' }} error: 'Invalid email' });
}
if (name && name.length < 2) {{ '{' }}
return res.status(400).json({{ '{' }} error: 'Name too short' });
}
const user = await this.userService.update(id, {{ '{' }} email, name });
res.json(user);
}
}Estrai tutta la logica di validazione dal UserController in un
middleware dedicato. Crea:
1. Un file src/middleware/validation.middleware.ts con funzioni
di validazione riutilizzabili usando class-validator
2. Un file src/dto/user.dto.ts con le classi DTO per CreateUser e UpdateUser
3. Aggiorna il controller per rimuovere la validazione inline
4. Aggiorna src/routes/user.routes.ts per usare il middleware di validazione
5. Aggiorna i test in tests/controllers/user.controller.test.tsCopilot Edits analizza i 5 file e genera modifiche coordinate. Vediamo il risultato per ciascun file.
// File: src/dto/user.dto.ts (GENERATO da Copilot Edits)
import {{ '{' }} IsEmail, IsString, MinLength, IsOptional } from 'class-validator';
export class CreateUserDto {{ '{' }}
@IsEmail({{ '{' }}}, {{ '{' }} message: 'Invalid email format' })
email: string;
@IsString()
@MinLength(2, {{ '{' }} message: 'Name must be at least 2 characters' })
name: string;
@IsString()
@MinLength(8, {{ '{' }} message: 'Password must be at least 8 characters' })
password: string;
}
export class UpdateUserDto {{ '{' }}
@IsOptional()
@IsEmail({{ '{' }}}, {{ '{' }} message: 'Invalid email format' })
email?: string;
@IsOptional()
@IsString()
@MinLength(2, {{ '{' }} message: 'Name must be at least 2 characters' })
name?: string;
}// File: src/middleware/validation.middleware.ts (GENERATO)
import {{ '{' }} Request, Response, NextFunction } from 'express';
import {{ '{' }} validate } from 'class-validator';
import {{ '{' }} plainToInstance } from 'class-transformer';
export function validateBody(dtoClass: any) {{ '{' }}
return async (req: Request, res: Response, next: NextFunction) => {{ '{' }}
const dtoInstance = plainToInstance(dtoClass, req.body);
const errors = await validate(dtoInstance, {{ '{' }}
whitelist: true,
forbidNonWhitelisted: true
});
if (errors.length > 0) {{ '{' }}
const messages = errors.flatMap(err =>
Object.values(err.constraints || {{ '{' }}})
);
return res.status(400).json({{ '{' }}
error: 'Validation failed',
details: messages
});
}
req.body = dtoInstance;
next();
};
}// File: src/controllers/user.controller.ts (DOPO - senza validazione)
import {{ '{' }} Request, Response } from 'express';
import {{ '{' }} UserService } from '../services/user.service';
export class UserController {{ '{' }}
constructor(private userService: UserService) {{ '{' }}}
async createUser(req: Request, res: Response) {{ '{' }}
// La validazione è gestita dal middleware
const {{ '{' }} email, name, password } = req.body;
const user = await this.userService.create({{ '{' }} email, name, password });
res.status(201).json(user);
}
async updateUser(req: Request, res: Response) {{ '{' }}
const {{ '{' }} id } = req.params;
const {{ '{' }} email, name } = req.body;
const user = await this.userService.update(id, {{ '{' }} email, name });
res.json(user);
}
}Edit Mode vs Agent Mode
La differenza fondamentale tra Edit Mode e Agent Mode sta nel livello di autonomia e nel tipo di azioni che Copilot può compiere.
Differenze Operative
| Aspetto | Edit Mode | Agent Mode |
|---|---|---|
| File di lavoro | Solo i file esplicitamente selezionati | Trova e modifica file autonomamente |
| Creazione file | Non crea nuovi file | Può creare nuovi file e cartelle |
| Esecuzione comandi | Non esegue comandi terminal | Può eseguire comandi (npm, build, test) |
| Auto-correzione | Richiede feedback manuale | Rileva errori e si auto-corregge |
| Contesto | File selezionati + file aperti | Intero workspace + terminal output |
| Conferma utente | Richiesta per ogni modifica | Richiesta solo per comandi terminal |
| Velocità | Più veloce (meno contesto) | Più lento (analisi approfondita) |
| Rischio | Basso (scope limitato) | Medio (più azioni autonome) |
Agent Mode: Sviluppo Autonomo nell'IDE
Agent Mode è la modalità più avanzata di Copilot nell'IDE. A differenza di Edit Mode, l'agente può navigare il filesystem, creare file, eseguire comandi nel terminale e, soprattutto, auto-correggersi quando qualcosa va storto.
Self-Healing: Auto-Correzione Intelligente
La caratteristica più distintiva di Agent Mode è il self-healing. Quando l'agente genera codice che produce errori (compilazione, lint, test), analizza autonomamente il messaggio di errore e prova a correggere il problema, ripetendo il ciclo fino al successo o al raggiungimento del limite di iterazioni.
Ciclo di Self-Healing
- Generazione: L'agente scrive il codice in base alla richiesta
- Verifica: Esegue il build o i test per verificare la correttezza
- Analisi errore: Se c'è un errore, legge il messaggio di errore completo
- Diagnosi: Identifica la causa (tipo mancante, import errato, sintassi)
- Correzione: Applica il fix e torna al punto 2
- Successo o escalation: Se dopo N iterazioni non riesce, chiede aiuto all'utente
Tipi di Errori Gestiti
Errori che Agent Mode Gestisce Autonomamente
| Tipo di Errore | Esempio | Strategia di Fix | Success Rate |
|---|---|---|---|
| Errori di tipo TypeScript | Property 'x' does not exist on type 'Y' |
Aggiunge la proprietà o corregge il tipo | Alto (90%+) |
| Import mancanti | Cannot find module '../services/user' |
Aggiunge l'import corretto o crea il file | Alto (95%+) |
| Errori di sintassi | Unexpected token, expected ';' |
Corregge la sintassi | Alto (95%+) |
| Dipendenze mancanti | Cannot find package 'lodash' |
Esegue npm install |
Alto (90%+) |
| Test falliti | Expected 42 but received undefined |
Analizza il test e corregge l'implementazione | Medio (60-70%) |
| Errori runtime | TypeError: Cannot read property of undefined |
Aggiunge null check o corregge la logica | Medio (50-70%) |
| Errori di configurazione | Invalid configuration option 'x' |
Corregge il file di configurazione | Medio (60-80%) |
| Errori logici complessi | Risultato errato senza messaggio chiaro | Potrebbe necessitare aiuto umano | Basso (30-40%) |
Come Abilitare e Configurare Agent Mode
// .vscode/settings.json
{{ '{' }}
// Abilita Agent Mode (abilitato di default nelle versioni recenti)
"github.copilot.chat.agent.enabled": true,
// Configura quali comandi l'agente può eseguire senza conferma
"github.copilot.chat.agent.autoApprove": {{ '{' }}
// Comandi che non richiedono conferma
"allowedCommands": [
"npm test",
"npm run lint",
"npm run build",
"npx tsc --noEmit"
],
// Comandi che richiedono sempre conferma
"blockedCommands": [
"rm",
"git push",
"npm publish",
"docker"
]
},
// Limite di iterazioni per il self-healing
"github.copilot.chat.agent.maxIterations": 5,
// File e cartelle che l'agente non può modificare
"github.copilot.chat.agent.protectedPaths": [
".env",
".env.*",
"secrets/",
"*.key",
"*.pem"
]
}Guardrail di Sicurezza
Agent Mode include guardrail progettati per prevenire azioni potenzialmente pericolose. È fondamentale configurarli correttamente, soprattutto in ambienti di produzione.
Protezioni Attive di Default
- Conferma richiesta per ogni comando terminal
- Non può accedere a file
.env - Non può eseguire
git pushsenza conferma - Non modifica file di configurazione del sistema
- Limite di iterazioni per evitare loop infiniti
- Non può installare dipendenze senza conferma
Protezioni Personalizzabili
- Lista di comandi auto-approvati
- Lista di comandi bloccati
- Percorsi protetti (non modificabili)
- Numero massimo di iterazioni
- Timeout per singola operazione
- Notifiche per operazioni sensibili
Plan Mode: Pianificazione Prima dell'Azione
Plan Mode è una modalità che aggiunge un passaggio di pianificazione prima dell'esecuzione. Invece di iniziare subito a modificare file, Copilot analizza la richiesta, pone domande chiarificatrici se necessario, e costruisce un piano di esecuzione dettagliato che puoi approvare, modificare o rifiutare prima che qualsiasi codice venga toccato.
Come Attivare il Plan Mode
Attivazione in Diversi IDE
| IDE | Metodo | Dettaglio |
|---|---|---|
| VS Code | Shift+Tab nella chat di Copilot |
Alterna tra Agent Mode e Plan Mode |
| JetBrains | Icona "Plan" nella toolbar di Copilot Chat | Disponibile in tutte le IDE JetBrains |
| Eclipse | Menu Copilot > Plan Mode | Integrato nel pannello Copilot |
| Xcode | Menu Copilot > Plan Mode | Supporto nativo |
Workflow del Plan Mode
- Richiesta: Descrivi il task in linguaggio naturale
- Analisi: Copilot analizza il codebase e identifica i file rilevanti
- Domande (opzionale): Se la richiesta è ambigua, pone domande chiarificatrici
- Piano: Genera un piano strutturato con:
- File da creare, modificare o eliminare
- Ordine delle operazioni
- Dipendenze tra le modifiche
- Comandi da eseguire
- Review: Tu esamini il piano e puoi modificarlo
- Esecuzione: Dopo approvazione, il piano viene eseguito step by step
Quando Usare il Plan Mode
Scenari Ideali per Plan Mode
| Scenario | Perché Plan Mode | Alternativa |
|---|---|---|
| Refactoring complesso | Vuoi verificare che il piano tocchi tutti i file necessari | Agent Mode potrebbe saltare file |
| Nuova feature multi-componente | Vuoi validare l'architettura prima dell'implementazione | Edit Mode richiederebbe troppo lavoro manuale |
| Migrazione di libreria | Vuoi vedere l'elenco completo dei file impattati | Agent Mode potrebbe dimenticare file |
| Task con requisiti ambigui | Le domande chiarificatrici evitano lavoro inutile | Agent Mode potrebbe assumere e sbagliare |
| Codice critico | Vuoi il controllo totale su ogni modifica | Nessuna: Plan Mode è la scelta migliore |
Esempio Pratico: Plan Mode per Feature Complessa
Aggiungi un sistema di notifiche in-app al progetto.
Requisiti:
- Modello Notification con titolo, messaggio, tipo, letto/non letto
- Service per CRUD notifiche
- Controller con endpoint REST
- Componente Angular con icona campanella e badge contatore
- WebSocket per aggiornamenti real-time
- Test per service e controller# Piano di Implementazione: Sistema Notifiche
## Domande Chiarificatrici
1. Vuoi persistere le notifiche su database o solo in memoria?
-> Risposta: Database (PostgreSQL con Prisma)
2. Le notifiche devono essere per utente specifico o broadcast?
-> Risposta: Per utente, con possibilità di broadcast
3. Quale libreria WebSocket preferisci?
-> Risposta: Socket.io (gia presente nelle dipendenze)
## File da Creare (5)
1. src/models/notification.model.ts - Schema Prisma e tipi
2. src/services/notification.service.ts - Business logic
3. src/controllers/notification.controller.ts - Endpoint REST
4. src/gateways/notification.gateway.ts - WebSocket gateway
5. frontend/src/app/components/notification-bell/ - Componente Angular
## File da Modificare (4)
1. prisma/schema.prisma - Aggiungere modello Notification
2. src/routes/index.ts - Registrare route notifiche
3. src/app.ts - Registrare WebSocket gateway
4. frontend/src/app/app.component.ts - Aggiungere notification-bell
## Comandi da Eseguire (3)
1. npx prisma migrate dev --name add-notifications
2. npm test -- --testPathPattern=notification
3. npm run build
## Ordine di Esecuzione
Phase 1: Backend (modello, service, controller)
Phase 2: WebSocket (gateway, eventi)
Phase 3: Frontend (componente, integrazione)
Phase 4: Test e verifica
## Stima: ~45 minuti di esecuzione agentNext Edit Suggestions (NES)
Next Edit Suggestions è una funzionalità che predice la sequenza di modifiche che probabilmente farai dopo un'operazione iniziale. Invece di suggerire solo il completamento della riga corrente, NES analizza il pattern della tua modifica e anticipa dove dovrai intervenire successivamente.
Come Funziona NES
Il meccanismo è intuitivo: fai una modifica in un punto del codice, e Copilot identifica automaticamente altri punti del file (o del progetto) che devono essere aggiornati di conseguenza. Un indicatore visuale appare nel gutter dell'editor, mostrando dove sono disponibili suggerimenti di modifica.
Interazione con NES
| Azione | Shortcut | Effetto |
|---|---|---|
| Navigare al prossimo suggerimento | Tab |
Il cursore si sposta al prossimo punto di modifica |
| Accettare il suggerimento | Tab (quando sul suggerimento) |
La modifica viene applicata |
| Rifiutare il suggerimento | Esc |
Il suggerimento scompare |
| Vedere tutti i suggerimenti | Icone nel gutter dell'editor | Indicatori visivi mostrano tutte le posizioni |
Casi d'Uso di NES
Scenari in cui NES Eccelle
| Scenario | Modifica Iniziale | Suggerimenti NES |
|---|---|---|
| Rinomina variabile | Rinomini userData in userProfile |
Suggerisce l'aggiornamento in tutti i punti dove la variabile è usata |
| Aggiunta parametro | Aggiungi un parametro options a una funzione |
Suggerisce di aggiornare tutti i chiamanti e il JSDoc |
| Cambio tipo | Cambi il tipo di ritorno da string a UserResponse |
Suggerisce aggiornamenti nei consumatori del valore |
| Aggiunta campo | Aggiungi un campo avatar all'interfaccia User |
Suggerisce aggiornamenti nelle factory, test, mapping |
| Cambio pattern | Converti un callback in async/await | Suggerisce la conversione in tutti i pattern simili nel file |
| Aggiunta import | Usi un nuovo tipo nel file | Suggerisce l'import statement corretto |
Esempio: Rinomina con NES
Supponiamo di rinominare una variabile data in userProfile
in un file con 15 occorrenze. Senza NES, dovresti cercare e sostituire manualmente o
usare il refactoring dell'IDE. Con NES, il processo diventa fluido.
// Step 1: Rinomini la prima occorrenza
const userProfile = await fetchUserData(userId);
// ^^^^^^^^^^^ modifica manuale
// Step 2: NES mostra indicatori nel gutter su tutte le altre occorrenze
// Linea 15: [NES] data.name -> userProfile.name
// Linea 23: [NES] data.email -> userProfile.email
// Linea 31: [NES] return data; -> return userProfile;
// Linea 45: [NES] if (data) -> if (userProfile)
// Step 3: Premi Tab per navigare al primo suggerimento
// Step 4: Premi Tab per accettare
// Step 5: Ripeti fino a completare tutte le occorrenze
// Risultato: tutte le 15 occorrenze aggiornate con pochi TabIndicatori nel Gutter
NES utilizza indicatori visuai nel gutter dell'editor (la colonna a sinistra dei numeri di riga) per mostrare dove sono disponibili suggerimenti. In VS Code, gli indicatori includono anche syntax highlighting nel suggerimento per facilitare la review visiva della modifica proposta.
Vantaggi di NES
- Editing 3-5x più veloce per modifiche ripetitive
- Riduce errori di rinomina parziale
- Funziona anche cross-file
- Comprende il contesto semantico
- Non richiede regex o find-replace
- Predice anche modifiche non ovvie
Limitazioni di NES
- Disponibile solo in VS Code (per ora)
- Potrebbe suggerire modifiche non desiderate
- Non sempre trova tutte le occorrenze
- La qualità dipende dalla chiarezza del pattern
- Non gestisce refactoring complessi
- Richiede attenzione nella review dei suggerimenti
Editing Symbol-Aware
Per linguaggi come C++ e C#, Copilot ha integrato una comprensione a livello di compilatore che va oltre il semplice pattern matching testuale. L'editing symbol-aware analizza simboli, tipi e dipendenze tra file, permettendo operazioni di refactoring semanticamente corrette su scala progetto.
Come Funziona
A differenza dell'editing tradizionale basato su testo, l'editing symbol-aware utilizza le informazioni del Language Server Protocol (LSP) per comprendere:
- Dichiarazioni: Dove un simbolo è definito
- Riferimenti: Dove un simbolo è utilizzato
- Tipi: Il tipo di ogni simbolo e le sue relazioni
- Scope: La visibilità di ogni simbolo
- Dipendenze: Quali file dipendono da un simbolo
Supporto Symbol-Aware per Linguaggio
| Linguaggio | IDE | Livello di Supporto | Operazioni Supportate |
|---|---|---|---|
| C++ | Visual Studio 2026 | Completo | Rinomina, cambio firma, estrai metodo, sposta tipo |
| C# | Visual Studio 2026 | Completo | Rinomina, cambio firma, estrai interfaccia, genera implementazione |
| TypeScript | VS Code | Parziale (via LSP) | Rinomina con NES, aggiornamento import |
| Java | JetBrains | Parziale | Rinomina, aggiornamento riferimenti |
| Python | VS Code / JetBrains | Base | Rinomina con suggerimenti contestuali |
Esempio: Cambio Firma di Metodo in C#
// PRIMA: Metodo originale in UserService.cs
public async Task<User> GetUserById(int id)
{{ '{' }}
return await _repository.FindAsync(id);
}
// MODIFICA: Aggiungi parametro 'includeOrders' alla firma
public async Task<User> GetUserById(int id, bool includeOrders = false)
{{ '{' }}
var user = await _repository.FindAsync(id);
if (includeOrders)
{{ '{' }}
user.Orders = await _orderRepository.FindByUserIdAsync(id);
}
return user;
}
// SYMBOL-AWARE: Copilot identifica TUTTI i 23 chiamanti nel progetto
// e suggerisce aggiornamenti per ciascuno:
// File: UserController.cs (linea 45)
// PRIMA: var user = await _userService.GetUserById(id);
// DOPO: var user = await _userService.GetUserById(id, false);
// File: OrderController.cs (linea 78)
// PRIMA: var user = await _userService.GetUserById(userId);
// DOPO: var user = await _userService.GetUserById(userId, true);
// File: UserServiceTests.cs (linea 112)
// PRIMA: var result = await service.GetUserById(1);
// DOPO: var result = await service.GetUserById(1, false);
// ... e cosi via per tutti i 23 riferimentiEsempi Pratici Avanzati
Vediamo alcuni scenari reali in cui le diverse modalità di editing si combinano per risolvere problemi complessi.
Esempio 1: Aggiungere una Feature con Agent Mode
Aggiungi paginazione a tutti gli endpoint che restituiscono liste.
Requisiti:
- Query params: page (default 1), limit (default 20, max 100)
- Risposta: {{ '{' }} data: T[], meta: {{ '{' }} page, limit, total, totalPages } }
- Endpoint coinvolti: GET /users, GET /orders, GET /products
- Aggiorna i test esistenti per verificare la paginazione
- Aggiorna la documentazione OpenAPI
Pattern da seguire: vedi src/utils/pagination.ts (se esiste) o crealoAgent Mode analizza il codebase, trova i 3 endpoint, crea l'utility di paginazione, modifica i controller e i service, aggiorna i test e la documentazione. Se un test fallisce durante il processo, l'agente analizza l'errore e si auto-corregge.
Esempio 2: Usare Plan Mode per Migrazione
Migra il progetto da Moment.js a Day.js.
Contesto:
- Moment.js e usato in 15 file
- Usiamo i plugin: timezone, relative-time, duration
- I test usano mock di Moment.js
- Il formato delle date in DB e ISO 8601
Requisiti:
- Sostituire tutti gli import di moment con dayjs
- Configurare i plugin equivalenti
- Aggiornare i format string se necessario
- Aggiornare tutti i test
- Rimuovere moment dalle dipendenze
- Verificare che il build compili senza errori# Piano di Migrazione: Moment.js -> Day.js
## Analisi Impatto
File impattati: 15
Test impattati: 8
Plugin da sostituire: 3
## Phase 1: Setup (5 min)
1. npm install dayjs
2. Creare src/utils/dayjs-config.ts con plugin
## Phase 2: Migrazione File (20 min)
File da modificare (ordine per dipendenze):
1. src/utils/date-helpers.ts (utility condiviso)
2. src/services/report.service.ts
3. src/services/scheduling.service.ts
4. src/controllers/report.controller.ts
... (altri 11 file)
## Phase 3: Test (10 min)
1. Aggiornare mock in tests/setup.ts
2. Aggiornare assertion nei test
3. Eseguire test suite completa
## Phase 4: Cleanup (5 min)
1. npm uninstall moment @types/moment
2. Verificare build
3. Verificare bundle size (atteso: -200KB)
## Rischi Identificati
- Il plugin timezone di Day.js ha API diversa
- Alcuni format string sono diversi
- I mock nei test potrebbero richiedere refactoringBest Practice per le Modalità di Editing
Guida alla Scelta della Modalità
| Situazione | Modalità Consigliata | Motivazione |
|---|---|---|
| Completare una singola funzione | Inline Suggestions | Veloce, contesto immediato sufficiente |
| Modificare 2-3 file correlati | Edit Mode | Controllo sui file, modifica coordinata |
| Implementare una feature completa | Agent Mode | Crea file, esegue comandi, si auto-corregge |
| Refactoring critico con molti file | Plan Mode | Piano verificabile prima dell'esecuzione |
| Rinomina e aggiornamenti ripetitivi | NES | Predittivo, veloce, Tab per navigare |
| Cambio firma metodo in progetto grande | Symbol-Aware + NES | Comprensione semantica cross-file |
| Task non urgente, codebase sconosciuto | Plan Mode + Agent Mode | Prima pianifica, poi esegui con supervisione |
Troubleshooting e Problemi Comuni
Le modalità di editing avanzato possono presentare problemi in determinate situazioni. Ecco come diagnosticare e risolvere i problemi più comuni.
Problemi Comuni e Soluzioni
| Problema | Causa | Soluzione |
|---|---|---|
| Agent Mode non trova file rilevanti | Struttura non convenzionale o file nascosti | Specifica i percorsi dei file nel prompt |
| Self-healing loop infinito | Errore strutturale che il fix non risolve | Interrompi, correggi manualmente il problema base |
| Edit Mode modifica troppo | Prompt troppo ampio | Sii specifico su cosa modificare e cosa NON toccare |
| NES non appare | Estensione non aggiornata o feature disabilitata | Aggiorna l'estensione, verifica settings |
| Plan Mode genera piano incompleto | Contesto insufficiente o progetto troppo grande | Aggiungi più contesto o limita lo scope |
| Comandi terminal falliscono | Environment non configurato o dipendenze mancanti | Verifica che il progetto compili manualmente prima |
| Modifiche incoerenti tra file | L'agente perde il contesto tra le modifiche | Suddividi in task più piccoli o usa Plan Mode |
Quando Fermare l'Agente
Segnali di Allarme
- Più di 3 iterazioni sullo stesso errore
- Le modifiche peggiorano il problema
- L'agente modifica file non pertinenti
- Il codice generato non ha senso logico
- Vengono aggiunte dipendenze non necessarie
- I test passano ma la logica è sbagliata
Azioni Correttive
- Premi
Ctrl+Cper interrompere - Usa
git diffper vedere tutti i cambiamenti - Fai
git stashogit checkoutper ripristinare - Riformula la richiesta con più contesto
- Suddividi il task in sotto-task
- Passa a Plan Mode per avere più controllo
Riepilogo e Prossimi Passi
Le modalità di editing avanzato di Copilot trasformano il modo in cui lavoriamo nel nostro IDE. Da suggerimenti inline a editing multi-file coordinato, da agente autonomo con self-healing a pianificazione prima dell'azione, ogni modalità ha il suo posto nel toolkit dello sviluppatore moderno.
Punti Chiave
- Edit Mode per modifiche coordinate su file specifici: tu scegli i file, Copilot genera le modifiche coerenti.
- Agent Mode per task autonomi con self-healing: l'agente esplora il progetto, esegue comandi e si auto-corregge.
- Plan Mode per controllo totale: pianifica prima, esegui dopo. Ideale per task complessi e codice critico.
- Next Edit Suggestions per editing fluido: Tab per navigare, Tab per accettare. Rinomina e aggiornamenti ripetitivi in pochi secondi.
- Symbol-Aware editing per refactoring semantico: comprensione a livello di compilatore per C++ e C# in Visual Studio.
Progresso della Serie
| # | Articolo | Stato |
|---|---|---|
| 1 | Foundation e Mindset | Completato |
| 2 | Ideazione e Requisiti | Completato |
| 3 | Architettura Backend | Completato |
| 4 | Struttura Frontend | Completato |
| 5 | Prompt Engineering | Completato |
| 6 | Testing e Qualità | Completato |
| 7 | Documentazione | Completato |
| 8 | Deploy e DevOps | Completato |
| 9 | Evoluzione | Completato |
| 10 | Coding Agent | Completato |
| 11 | Code Review Automatica | Completato |
| 12 | Copilot Edits e Agent Mode | Completato |
| 13 | GitHub Spark | Prossimo |
| 14 | Copilot Spaces | In arrivo |
| 15 | Modelli AI | In arrivo |
| 16 | Personalizzazione | In arrivo |
| 17 | Enterprise | In arrivo |
| 18 | Estensioni | In arrivo |
| 19 | Sicurezza | In arrivo |
Nel prossimo articolo esploreremo GitHub Spark, la piattaforma per creare micro-applicazioni AI-native direttamente dal browser usando il linguaggio naturale, senza necessità di scrivere codice o configurare infrastruttura.