Schnellstart – Verwenden von Azure-Pipelines zum Erstellen und Veröffentlichen eines Node.js Pakets

Azure DevOps Services | Azure DevOps Server 2022 - Azure DevOps Server 2019 | TFS 2018

Sie können eine Azure DevOps-Pipeline verwenden, um JavaScript-Apps zu erstellen, bereitzustellen und zu testen.

In dieser Schnellstartanleitung wird erläutert, wie Sie eine Pipeline verwenden, um ein Node.js Paket mit Node Package Manager (npm) zu erstellen und ein Pipelineartefakt zu veröffentlichen.

Voraussetzungen

Sie müssen über die folgenden Elemente in Azure DevOps verfügen:

YAML ist für TFS 2018 nicht verfügbar.

1 – Freihandeingabe des Beispielcodes

Verzweigen Sie das folgende Beispiel Express.js Server-App auf GitHub.

https://github.com/Azure-Samples/js-e2e-express-server

2 – Erstellen Ihrer Pipeline

  1. Melden Sie sich bei Azure Pipelines an. Ihr Browser wird zu https://dev.azure.com/my-organization-name Ihrem Azure DevOps-Dashboard wechseln und anzeigen.

  2. Wechseln Sie zu Ihrem Projekt, und wählen Sie "Pipelines>Erstellen einer neuen Pipeline" aus.

  3. Wählen Sie GitHub als Speicherort ihres Quellcodes aus.

  4. Wenn Sie zu GitHub umgeleitet werden, um sich anzumelden, geben Sie Ihre GitHub-Anmeldeinformationen ein.

  5. Wenn die Liste der Repositorys angezeigt wird, wählen Sie Ihr Node.js Beispielrepository aus.

  6. Azure Pipelines analysiert den Code in Ihrem Repository und empfiehlt die Node.js Vorlage für Ihre Pipeline. Wählen Sie diese Vorlage aus.

  7. Azure Pipelines generiert eine YAML-Datei für Ihre Pipeline. Wählen Sie "Commit speichern" aus, und führenSie"Commit" direkt in den Hauptzweig aus, und wählen Sie dann "Speichern" aus, und führen> Sie es erneut aus.

  8. Eine neue Ausführung wird gestartet. Warten Sie, bis die Ausführung beendet ist.

Wenn Sie fertig sind, haben Sie eine funktionierende YAML-Datei azure-pipelines.yml in Ihrem Repository, die sie anpassen können.

  1. Erstellen Sie eine Pipeline , und wählen Sie die YAML-Vorlage aus.

  2. Legen Sie den Agentpool und den YAML-Dateipfad für Ihre Pipeline fest.

  3. Speichern Sie die Pipeline, und stellen Sie einen Build in die Warteschlange. Wenn die Meldung "Build #nnnnnnnn.n" in die Warteschlange gestellt wurde , wählen Sie den Nummernlink aus, um die Pipeline in Aktion anzuzeigen.

3 – Erstellen Ihres Pakets und Veröffentlichen eines Artefaktes

  1. Bearbeiten Sie Ihre Azure-pipelines.yml-Datei .

  2. Aktualisieren Sie die Node.js Tool Installer-Aufgabe , um Node.js Version 16 LTS zu verwenden.

    trigger:
    - main
    
    pool:
      vmImage: 'ubuntu-latest'
    
    steps:
    - task: NodeTool@0
      inputs:
        versionSpec: '16.x'
      displayName: 'Install Node.js'
    
    - script: |
        npm install
      displayName: 'npm install'
    
    - script: |
        npm run build
      displayName: 'npm build'
    
  3. Fügen Sie Ihrer Pipeline neue Aufgaben hinzu, um Ihr npm-Paket, "package.json" zu kopieren und Ihr Artefakte zu veröffentlichen. Die Aufgabe "Dateien kopieren" kopiert Dateien aus dem lokalen Pfad des Agents, in dem Ihre Quellcodedateien heruntergeladen werden, und speichert Dateien in einem lokalen Pfad auf dem Agent, in den alle Artefakte kopiert werden, bevor sie an ihr Ziel übertragen werden. Diese Dateien werden in einem npm-Ordner gespeichert. Die Aufgabe "Pipelineartefakte veröffentlichen" lädt die Dateien aus den früheren Aufgaben "Dateien kopieren" herunter und stellt sie als Pipelineartefakte zur Verfügung, die mit Ihrem Pipelinebuild veröffentlicht werden.

    - task: CopyFiles@2
      inputs:
        sourceFolder: '$(Build.SourcesDirectory)'
        contents: '*.tgz' 
        targetFolder: $(Build.ArtifactStagingDirectory)/npm
      displayName: 'Copy npm package'
    
    - task: CopyFiles@2
      inputs:
        sourceFolder: '$(Build.SourcesDirectory)'
        contents: 'package.json' 
        targetFolder: $(Build.ArtifactStagingDirectory)/npm
      displayName: 'Copy package.json'   
    
    - task: PublishPipelineArtifact@1
      inputs:
        targetPath: '$(Build.ArtifactStagingDirectory)/npm'
        artifactName: npm
      displayName: 'Publish npm artifact'
    

4 – Führen Sie Ihre Pipeline aus

Speichern und ausführen Sie Ihre Pipeline. Überprüfen Sie nach dem Ausführen der Pipeline, ob der Auftrag erfolgreich ausgeführt wurde und dass ein veröffentlichtes Artefakte angezeigt wird.

Screenshot der erfolgreichen Pipelineausführung mit einem Artefakte.

  1. Fork the following repo at GitHub.

    https://github.com/Azure-Samples/js-e2e-express-server
    
  2. Nachdem Sie über den Beispielcode in Ihrem eigenen Repository verfügen, erstellen Sie Ihre erste Pipeline , und wählen Sie die Vorlage "Leerer Prozess " aus.

  3. Wählen Sie " Prozess" auf der Registerkarte "Vorgänge " im Pipeline-Editor aus, und ändern Sie die Eigenschaften wie folgt:

    • Agent-Warteschlange:Hosted Ubuntu 1604
  4. Fügen Sie der Pipeline in der angegebenen Reihenfolge die folgenden Aufgaben hinzu:

    • npm

      • Befehl:install
    • npm

      • Anzeigename:npm test
      • Befehl:custom
      • Befehl und Argumente:test
    • Veröffentlichen von Testergebnissen

      • Alle Standardwerte für Eigenschaften lassen
    • Archivdateien

      • Stammordner oder Datei zum Archivieren:$(System.DefaultWorkingDirectory)
      • Voreingestellter Stammordnername für Archivpfade: Deaktiviert
    • Buildartefakte veröffentlichen

      • Alle Standardwerte für Eigenschaften lassen
  5. Speichern Sie die Pipeline, und warteschlange Sie einen Build, um ihn in Aktion anzuzeigen.

Nächste Schritte

Herzlichen Glückwunsch! Sie haben diese Schnellstartanleitung erfolgreich abgeschlossen!