Démarrage rapide - Utiliser Azure Pipelines pour générer et publier un package Node.js

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

Vous pouvez utiliser un pipeline Azure DevOps pour générer, déployer et tester des applications JavaScript.

Ce guide de démarrage rapide explique comment utiliser un pipeline pour créer un package Node.js avec node Package Manager (npm) et publier un artefact de pipeline.

Prérequis

Vous devez disposer des éléments suivants dans Azure DevOps :

• Un compte GitHub dans lequel vous pouvez créer un référentiel. Créez-en un gratuitement.
• Une organisation et un projet Azure DevOps. Créez-en un gratuitement.
• Possibilité d’exécuter des pipelines sur des agents hébergés par Microsoft. Vous pouvez acheter un travail parallèle ou demander un niveau gratuit.

YAML n’est pas disponible pour TFS 2018.

1 - Dupliquer l’exemple de code

Duplication de l’exemple suivant Express.js application serveur sur GitHub.

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

2 - Créer votre pipeline

1. Connectez-vous à Azure Pipelines. Votre navigateur va accéder à https://dev.azure.com/my-organization-name votre tableau de bord Azure DevOps et l’afficher.

2. Accédez à votre projet et sélectionnez Pipelines>Créer un pipeline.

3. Sélectionnez GitHub comme emplacement de votre code source.

4. Si vous êtes redirigé vers GitHub pour vous connecter, entrez vos informations d’identification GitHub.

5. Lorsque la liste des référentiels s’affiche, sélectionnez votre exemple de référentiel Node.js.

6. Azure Pipelines analyse le code dans votre référentiel et recommande le Node.js modèle pour votre pipeline. Sélectionnez ce modèle.

7. Azure Pipelines génère un fichier YAML pour votre pipeline. Sélectionnez Enregistrer et exécuter>Commit directement dans la branche principale, puis sélectionnez Enregistrer et réexécuter .

8. Une nouvelle exécution démarre. Attendez la fin de l’exécution.

Lorsque vous avez terminé, vous disposez d’un fichier YAML opérationnel azure-pipelines.yml dans votre référentiel prêt à être personnalisé.

1. Créez un pipeline et sélectionnez le modèle YAML .

2. Définissez le chemin du pool d’agents et du fichier YAML pour votre pipeline.

3. Enregistrez le pipeline et la file d’attente d’une build. Lorsque le message Build #nnnnnnnn.n a été mis en file d’attente , sélectionnez le lien numéro pour afficher votre pipeline en action.

3 - Créer votre package et publier un artefact

1. Modifiez votre fichier azure-pipelines.yml .

2. Mettez à jour la tâche programme d’installation de l’outilNode.js pour utiliser Node.js version 16 LTS.

   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. Ajoutez de nouvelles tâches à votre pipeline pour copier votre package npm, package.json et publier votre artefact. La tâche Copier des fichiers copie des fichiers à partir du chemin d’accès local sur l’agent où vos fichiers de code source sont téléchargés et enregistre des fichiers dans un chemin local sur l’agent vers lequel tous les artefacts sont copiés avant d’être envoyés à leur destination. Ces fichiers sont enregistrés dans un dossier npm . Latâche Publier des artefacts de pipeline publie des artefacts de pipeline, télécharge les fichiers à partir des tâches de copie précédentes et les met à disposition en tant qu’artefacts de pipeline qui seront publiés avec votre build de pipeline.

   - 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 - Exécuter votre pipeline

Enregistrez et exécutez votre pipeline. Une fois votre pipeline exécuté, vérifiez que le travail s’est exécuté correctement et que vous voyez un artefact publié.

1. Dupliquez le dépôt suivant sur GitHub.

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

2. Une fois que vous avez l’exemple de code dans votre propre référentiel, créez votre premier pipeline et sélectionnez le modèle de processus vide .

3. Sélectionnez Processus sous l’onglet Tâches dans l’éditeur de pipeline et modifiez les propriétés comme suit :

   • File d’attente de l’agent :Hosted Ubuntu 1604

4. Ajoutez les tâches suivantes au pipeline dans l’ordre spécifié :

   • npm

     • Commande:install

   • npm

     • Nom d’affichage :npm test
     • Commande:custom
     • Commande et arguments :test

   • Publier les résultats des tests

     • Conservez toutes les valeurs par défaut pour les propriétés

   • Archiver des fichiers

     • Dossier racine ou fichier à archiver :$(System.DefaultWorkingDirectory)
     • Nom du dossier racine ajouté aux chemins d’accès d’archive : Décochée

   • Publier des artefacts de build

     • Conservez toutes les valeurs par défaut pour les propriétés

5. Enregistrez le pipeline et mettez en file d’attente une build pour la voir en action.

Étapes suivantes

Félicitations, vous avez terminé ce démarrage rapide !

Configurer JavaScript