Crea un assistente del codice AI con Pipet Code Agent

Scrivere codice può essere gratificante e soddisfacente, ma ottenere il codice da lavorare con presentabile per i colleghi è spesso un compito arduo. Artificiali di machine learning può aiutarti ad aggiungere commenti al codice, trovare prima che lo facciano i revisori ed eseguire una serie di altre attività per per semplificare il flusso di lavoro di programmazione.

Questo tutorial mostra come estendere Agente di codice Pipet, uno strumento di assistenza per la programmazione basato sull'IA creato dal team AI Developer Relations presso in tutti i canali Google. Questo progetto open source è un'estensione di Microsoft Visual Studio Code (VS Code) che ti consente di occuparsi di alcune delle attività importanti ma meno divertenti della programmazione, come i commenti il tuo codice, individuare errori e suggerire miglioramenti. L'estensione invia assistenza per la programmazione all'API Gemini e incorpora le risposte la finestra di modifica del codice.

Puoi modificare la pipeline per far funzionare meglio queste funzioni esistenti oppure creare nuovi comandi supportare al meglio il flusso di lavoro di sviluppo.

Per una panoramica video del progetto e di come estenderlo, inclusi approfondimenti da chi l'ha creato, dai un'occhiata Assistente IA Code - Crea con l'IA di Google. In alternativa, puoi iniziare a estendere il progetto seguendo le istruzioni di seguito.

Configurazione del progetto

Queste istruzioni illustrano come configurare il progetto Agente di codice Pipet per lo sviluppo e il test. I passaggi generali prevedono l'installazione di alcuni prerequisiti software, impostando alcune variabili di ambiente, clonando il progetto dal codice repository ed eseguire l'installazione della configurazione.

Installa i prerequisiti

Il progetto Agente di codice Pipet viene eseguito come un'estensione di Microsoft Visual Studio Code e utilizza Node.js e lo strumento npm per la gestione pacchetti ed eseguire l'applicazione. Le seguenti istruzioni di installazione sono per un computer host Linux.

Per installare il software richiesto:

  1. Installa Visual Studio Code. per la tua piattaforma.
  2. Installa node e npm seguendo le istruzioni di installazione istruzioni per la tua piattaforma.

clona e configura il progetto

Scarica il codice del progetto e utilizza il comando di installazione npm per eseguire l'operazione le dipendenze richieste e configurare il progetto. Ti servono il software di controllo del codice sorgente git per recuperare il codice sorgente del progetto.

Per scaricare e configurare il codice del progetto:

  1. Clona il repository git utilizzando il comando seguente.
    git clone https://github.com/google/generative-ai-docs
    
  2. Facoltativamente, configura il repository Git locale per utilizzare il pagamento sparso, in modo da avere solo i file del progetto Agente Documenti.
    cd generative-ai-docs/
    git sparse-checkout init --cone
    git sparse-checkout set examples/gemini/node/pipet-code-agent/
    
  3. Vai alla directory principale del progetto Pipet Code Agent.
    cd generative-ai-docs/examples/gemini/node/pipet-code-agent/
    
  4. Esegui il comando di installazione per scaricare le dipendenze e configurare il progetto:
    npm install
    

Configurare e testare l'estensione

Ora dovresti essere in grado di testare l'installazione eseguendo l'agente di codice Pipet come un'estensione di sviluppo in VS Code sul tuo dispositivo. Il test apre una finestra Codice finestra Host sviluppo estensione in cui è disponibile la nuova estensione. In questa nuova finestra, configurerai la chiave API utilizzata dall'estensione per accedere al l'API Gemini di Google.

Agente di codice pipeline in esecuzione nella finestra host di sviluppo estensione Figura 1. Finestra VS Code Extension Development Host (Host di sviluppo estensione di codice VS) con la pipeline i comandi delle estensioni.

Per configurare e testare la configurazione:

  1. Avvia l'applicazione VS Code.
  2. In VS Code, crea una nuova finestra selezionando File > Nuova finestra.
  3. Apri il progetto Agente di codice Pipet selezionando File > Apri cartella, e selezionando la cartella pipet-code-agent/.
  4. Apri il file pipet-code-agent/package.json.
  5. Esegui l'estensione in modalità di debug selezionando Esegui > Avvia il debug. Questo passaggio apre una finestra separata per l'host di sviluppo dell'estensione del codice VS.
  6. Apri le impostazioni di VS Code selezionando Codice > Impostazioni > Impostazioni.
  7. Ottieni una chiave API Gemini di Google dal Generative AI Developer e copia la stringa chiave.
  8. Imposta la chiave API come impostazione di configurazione. In Impostazioni di ricerca digita pipet, seleziona la scheda Utente e, nel campo Google > Gemini: API, fai clic sul link Modifica in settings.json e aggiungi il tuo Chiave API Gemini:
    "google.gemini.apiKey": "your-api-key-here"
    
  9. Salva le modifiche apportate al file settings.json e chiudi le schede delle impostazioni.
di Gemini Advanced.

Per testare i comandi dell'estensione:

  1. Nella finestra dell'host di sviluppo dell'estensione di VS Code, seleziona un codice qualsiasi nella finestra dell'editor.
  2. Apri la tavolozza dei comandi selezionando Visualizza > Tavolozza dei comandi.
  3. Nella tavolozza dei comandi, digita Pipet e seleziona uno dei comandi con con quel prefisso.

Modifica comando esistente

La modifica dei comandi forniti nell'agente di codice Pipet è il modo più semplice modificare il comportamento e le funzionalità dell'estensione. Sia il commento che i comandi di revisione utilizzano con pochi prompt approccio con esempi di codice e commenti relativi a quel codice, oltre ad alcuni istruzioni generali per il modello di IA generativa. Contesto del prompt informazioni guida il modello generativo Gemini nella formazione di una risposta. Di modificare le istruzioni del prompt, gli esempi o entrambi nel commento o review, puoi modificare il comportamento di ciascuno dei comandi esistenti.

Questo insieme di istruzioni spiega come modificare il comando review.ts tramite modificare il testo del comando.

Per prepararti a modificare il comando review.ts:

  1. Avvia l'applicazione VS Code.
  2. In VS Code, crea una nuova finestra selezionando File > Nuova finestra.
  3. Apri il progetto Agente di codice Pipet selezionando File > Apri cartella, e selezionando la cartella pipet-code-agent/.
  4. Apri il file pipet-code-agent/src/review.ts.

Per modificare il comportamento del comando review.ts:

  1. Nel file review.ts, modifica l'inizio di PROMPT seguendo istruzioni diverse.
    const PROMPT = '
    Write review comments for following code, identifying bugs and ways to improve code quality. Examples of bugs are syntax errors or typos, out of memory errors, and boundary value errors. Examples of improving code quality are reducing complexity of code, eliminating duplicate code, and ensuring other developers
    are able to understand the code.
    ${CODE_LABEL}
    ...
  2. Facoltativamente, nel file review.ts, aggiungi un altro esempio alla un elenco di esempi di revisione del codice e del codice.
    ...
    ${REVIEW_LABEL}
    There are duplicate lines of code in this control structure.
    ${CODE_LABEL}
    const fixed_value = 128;
    ${REVIEW_LABEL}
    Make sure constant names are in all capitals (FIXED_VALUE) for clarity.
    ';
  3. Salva le modifiche apportate al file review.ts.

Per testare il comando modificato:

  1. Nella finestra del progetto dell'estensione VS Code Pipet, riavvia il debugger selezionando Esegui > Riavvia il debug.
  2. Nella finestra dell'host di sviluppo dell'estensione di VS Code, seleziona un codice qualsiasi nella finestra dell'editor.
  3. Apri la tavolozza dei comandi selezionando Visualizza > Tavolozza dei comandi.
  4. Nella tavolozza dei comandi, digita Pipet e seleziona Pipetta: esamina il comandocon codice selezionato.

Crea nuovo comando

Puoi estendere Pipet creando nuovi comandi che eseguono attività completamente nuove con l'API Gemini. Ogni file di comando (comment.ts e review.ts) è costituito indipendente e include codice per la raccolta di testo dall'editor attivo, comporre un prompt, connettersi all'API Gemini, inviare un prompt e gestire la risposta.

Agente di codice della pipeline con il nome mostrato dalla funzione di selezione Figura 2. Nuovo comando per il suggerimento del nome della funzione nell'estensione di codice VS nella finestra Host di sviluppo.

Questa serie di istruzioni spiega come creare un nuovo comando utilizzando il codice un comando esistente, comment.ts, come modello.

Per creare un comando che consiglia i nomi delle funzioni:

  1. Crea una copia del file pipet-code-agent/src/comment.ts denominato name.ts nella directory src/.
  2. In VS Code, apri il file src/name.ts.
  3. Modifica le istruzioni del prompt nel file name.ts per la modifica del valore PROMPT.
    // Provide instructions for the AI generative model
    const PROMPT = `Recommend a name for this function. Explain your
    reasoning in 3 sentences or less:`;
    
  4. Modifica il nome della funzione comando e il relativo messaggio informativo.
    export async function generateName() {
      vscode.window.showInformationMessage('Generating function name...');
    
  5. Aggiorna il codice dell'assemblaggio del prompt in modo da includere solo PROMPT e il testo selezionato nell'editor.
      // Build the full prompt using the template.
      const fullPrompt = `${PROMPT}
    "
    ${selectedCode}
    "
    `;
  6. Modifica l'output della risposta per descrivere ciò che sta generando.
        // update prefix to describe output
        let commentIntro = padding + commentPrefix + "Recommended name: (generated)\n";
        editBuilder.insert(selection.start, commentIntro);
        editBuilder.insert(selection.start, pyComment);
    
  7. Salva le modifiche apportate al file review.ts.

Integra il nuovo comando

Dopo aver completato il codice per il nuovo comando, devi integrarlo con il resto dell'estensione. Aggiorna i file extension.ts e package.json in rendere il nuovo comando parte dell'estensione e abilitare VS Code per richiamare il nuovo comando.

Per integrare il comando name con il codice dell'estensione:

  1. In VS Code, apri il file pipet-code-agent/src/extension.ts.
  2. Aggiungi il nuovo file di codice all'estensione aggiungendo una nuova importazione l'Informativa.
    import { generateName } from './name';
    
  3. Registra il nuovo comando aggiungendo il seguente codice alla sezione Funzione activate().
    export function activate(context: vscode.ExtensionContext) {
        ...
        vscode.commands.registerCommand('pipet-code-agent.nameFunction', generateName);
    }
  4. Salva le modifiche apportate al file extension.ts.

Per integrare il comando name con il pacchetto dell'estensione:

  1. In VS Code, apri il file pipet-code-agent/package.json.
  2. Aggiungi il nuovo comando alla sezione commands del pacchetto .
      "contributes": {
        "commands": [
          ...
          {
            "command": "pipet-code-agent.nameFunction",
            "title": "Pipet: Name the selected function."
          }
        ],
    
  3. Salva le modifiche apportate al file package.json.

Prova il nuovo comando

Dopo aver completato la programmazione del comando e l'integrazione con estensione, puoi testarla. Il tuo nuovo comando è disponibile solo in VS Code Host di sviluppo estensione e non nella finestra VS codice in cui modificato il codice dell'estensione.

Per testare il comando modificato:

  1. Nella finestra del progetto dell'estensione VS Code Pipet, riavvia il debugger selezionando Esegui > Riavvia debug, che riavvia un Finestra Host sviluppo estensione.
  2. Nella finestra Host di sviluppo estensione di VS Code, seleziona il codice nella finestra dell'editor.
  3. Apri la tavolozza dei comandi selezionando Visualizza > Tavolozza dei comandi.
  4. Nella tavolozza dei comandi, digita Pipet e seleziona Pipetta: assegna un nome funzione selezionata.

Risorse aggiuntive

Per ulteriori informazioni sul progetto Pipet Code Agent, consulta repository di codice. Se hai bisogno di aiuto per creare l'applicazione o sei alla ricerca di uno sviluppatore collaboratori, dai un'occhiata Discord della community Google Developers o server web.

Applicazioni di produzione

Se prevedi di implementare l'agente Documenti per un ampio pubblico, tieni presente che l'uso l'API Gemini di Google potrebbe essere soggetta a limitazioni di frequenza e ad altre limitazioni di utilizzo. Se stai pensando di creare un'applicazione di produzione con l'API Gemini, ad esempio Agente Documenti, controlla Vertex AI di Google Cloud per una maggiore scalabilità e affidabilità dell'app.