Pipelines pour les applications JavaScript

Cet article explique comment Azure Pipelines fonctionne avec des applications JavaScript. Les agents hébergés par Microsoft préinstallent les outils de génération, de test et de déploiement JavaScript courants tels que npm, Node.js, Yarn et Gulp sans avoir à configurer une infrastructure. Vous pouvez également configurer des agents auto-hébergés.

Pour créer rapidement un pipeline pour JavaScript, consultez le guide de démarrage rapide JavaScript.

Installateurs de l'outil Node

Pour installer Node.js et les versions npm qui ne sont pas préinstallées ou pour installer les outils sur les agents auto-hébergés :

• Pour npm, exécutez la npm i -g npm@version-number commande dans votre pipeline.
• Pour Node.js, ajoutez la tâche Use Node.js ecosystem v1 (UseNode@1) à votre pipeline.

YAML

Pour installer une version Node.js spécifique, ajoutez le code suivant à votre fichier azure-pipelines.yml :

- task: UseNode@1
  inputs:
    version: '16.x' # replace with the version you need

Notes

Cette tâche peut nécessiter un temps considérable pour mettre à jour vers une version mineure plus récente chaque fois que le pipeline s'exécute. Les agents hébergés par Microsoft sont régulièrement mis à jour. Utilisez cette tâche uniquement pour installer des versions de Nœud spécifiques qui ne sont pas préinstallées. Pour savoir quelles versions Node.js et npm sont préinstallées sur les agents hébergés par Microsoft, consultez Software.

Classique

Pour installer une version Node.js spécifique dans un pipeline Classique :

1. Sous l’onglet Tâches de votre pipeline, sélectionnez le travail qui exécute vos tâches de génération, puis sélectionnez + pour ajouter une nouvelle tâche.
2. Dans le catalogue de tâches, recherchez et ajoutez la tâche d’installation de l’outilNode.js .
3. Sous Spécification de version dans l’écran de configuration des tâches, spécifiez la version du runtime Node.js que vous souhaitez installer.

Notes

Après avoir ajouté la tâche, vous pouvez déposer le sélecteur de version de tâche en haut de l’écran de configuration et sélectionner la version 1.* (préversion) de la tâche, appelée Utiliser Node.js écosystème. Si vous utilisez cette version de tâche, utilisez le champ Version pour spécifier la version Node.js runtime souhaitée.

Utiliser plusieurs versions de nœud

YAML

Vous pouvez utiliser la tâche Utiliser Node.js écosystème v1 avec une matrix stratégie pour générer et tester votre application sur plusieurs versions de Node.js. Pour plus d’informations, consultez Configuration multi-travaux.

pool:
  vmImage: 'ubuntu-latest'
strategy:
  matrix:
    node_16_x:
      node_version: 16.x
    node_13_x:
      node_version: 18.x

steps:
- task: UseNode@1
  inputs:
    version: $(node_version)

- script: npm install

Classique

Pour générer et tester votre application sur plusieurs versions de Node.js, consultez configuration multi-travaux.

Installation d'outils de gestion des dépendances

Si vous avez des outils de dépendance de développement dans votre projet package.json ou package-lock.json fichier, installez les outils et les dépendances via npm. Le fichier projet définit la version exacte des outils, indépendamment des autres versions qui existent sur l’agent de build.

Pour installer ces outils sur votre agent de build, utilisez un script, la tâche npm ou une tâche de ligne de commande dans votre pipeline.

Pour utiliser un script :

- script: npm install --only=dev

Pour utiliser la tâche npm :

- task: Npm@1
  inputs:
     command: 'install'

Les outils que vous installez de cette façon utilisent l’exécuteur de package npm npx , qui détecte les outils dans sa résolution PATH. L’exemple suivant appelle l’exécuteur mocha de test et utilise la version de dépendance de développement plutôt que la version installée globalement via npm install -g.

- script: npx mocha

Pour installer les outils dont votre projet a besoin qui ne sont pas définis en tant que dépendances de développement dans package.json, appelez npm install -g à partir d’un script dans votre pipeline. L’exemple suivant installe la dernière version de l’interface CLI Angular à l’aide de npm. D’autres scripts du pipeline peuvent ensuite utiliser les commandes Angular ng .

- script: npm install -g @angular/cli

Notes

Sur les agents Linux hébergés par Microsoft, précédez la commande avec sudo, comme sudo npm install -g.

Ces tâches d’installation de l’outil s’exécutent chaque fois que le pipeline s’exécute, donc gardez à l’esprit leur impact sur les temps de build. Si la surcharge a un impact sérieux sur les performances de build, envisagez d’utiliser des agents auto-hébergés préconfigurés avec les versions d’outils dont vous avez besoin.

Téléchargements de paquets de dépendances

Vous pouvez utiliser Yarn ou Azure Artifacts pour télécharger des packages à partir du registre npm public ou d’un registre npm privé que vous spécifiez dans un fichier *.npmrc . Pour spécifier un registre npm, ajoutez son URL au fichier *.npmrc dans votre référentiel de code.

Utiliser npm

Vous pouvez utiliser npm pour télécharger des packages de build dans votre pipeline de la manière suivante :

• Pour le moyen le plus simple de télécharger des packages sans authentification, exécutez npm installdirectement .
• Pour utiliser un registre authentifié, ajoutez la tâche npm .
• Pour exécuter npm install à partir de l’intérieur des exécuteurs de tâches Gulp, Grunt ou Maven, utilisez la tâche d’authentification npm .

Notes

Si votre flux npm utilise l’authentification, vous devez créer une connexion de service npm sous l’onglet Services dans les paramètres azure DevOps Project pour gérer ses informations d’identification.

Pour installer directement les packages npm, utilisez le script suivant dans azure-pipelines.yml. Si votre agent de build n’a pas besoin de dépendances de développement, vous pouvez accélérer les temps de génération en ajoutant l’option --only=prod à npm install.

- script: npm install --only=prod

Pour utiliser un registre privé spécifié dans votre fichier *.npmrc , ajoutez la Npm@1 tâche à azure-pipelines.yml.

- task: Npm@1
  inputs:
    customEndpoint: <Name of npm service connection>

Pour transmettre les informations d’identification du registre aux commandes npm via des gestionnaires de tâches comme Gulp, ajoutez la tâche npmAuthenticate@0 au fichier azure-pipelines.yml avant d’appeler le gestionnaire de tâches.

- task: npmAuthenticate@0
  inputs:
    customEndpoint: <Name of npm service connection>

Notes

Les agents hébergés par Microsoft utilisent un nouvel ordinateur avec chaque build. La restauration des dépendances peut prendre beaucoup de temps. Pour atténuer le problème, vous pouvez utiliser Azure Artifacts ou un agent auto-hébergé avec le cache de package.

Si vos builds échouent occasionnellement en raison de problèmes de connexion lorsque vous restaurez des packages à partir du registre npm, vous pouvez utiliser Azure Artifacts avec des sources en amont pour mettre en cache les packages. Azure Artifacts utilise automatiquement les informations d’identification du pipeline, qui sont généralement dérivées du compte Project Collection Build Service .

Utiliser Yarn

Utilisez un script pour installer Yarn pour restaurer les dépendances. Yarn est préinstallé sur certains agents hébergés par Microsoft. Vous pouvez installer et configurer Yarn sur des agents auto-hébergés comme n’importe quel autre outil.

- script: yarn install

Vous pouvez également utiliser la tâche CLI ou Bash dans votre pipeline pour appeler Yarn.

Compilateurs JavaScript

Les applications JavaScript utilisent des compilateurs tels que Babel et le compilateur TypeScripttsc pour convertir le code source en versions utilisables par le runtime Node.js ou dans les navigateurs web. Si vous avez configuré un objet de script dans votre fichier package.json projet pour exécuter votre compilateur, vous pouvez l’appeler dans votre pipeline.

- script: npm run compile

Vous pouvez également appeler des compilateurs directement à partir du pipeline à l’aide d’un script. Ces commandes s’exécutent à partir de la racine du référentiel de code source cloné.

- script: tsc --target ES6 --strict true --project tsconfigs/production.json

Vous pouvez utiliser la tâche npm pour générer le code si votre projet package.json définit un script de compilation. Si vous ne définissez pas de script de compilation, vous pouvez utiliser la tâche Bash pour compiler votre code.

Test des unités

Vous pouvez configurer vos pipelines pour exécuter vos tests JavaScript afin qu’ils produisent des résultats au format XML JUnit. Vous pouvez ensuite publier les résultats à l’aide de la tâche Publier les résultats des tests .

Si votre infrastructure de test ne prend pas en charge la sortie JUnit, ajoutez la prise en charge via un module de création de rapports partenaires tel que mocha-junit-reporter. Vous pouvez mettre à jour votre script de test pour utiliser le reporter JUnit ou passer ces options dans la définition de tâche si le reporter prend en charge les options de ligne de commande.

Le tableau suivant répertorie les exécuteurs de test les plus couramment utilisés et les reporters que vous pouvez utiliser pour produire des résultats XML :

Exécuteur de tests	Reporters pour les rapports XML
Mocha	mocha-junit-reporter cypress-multi-reporters
Jasmin	jasmine-reporters
Jest	jest-junit jest-junit-reporter
Karma	karma-junit-reporter
Ava	tap-xunit

L’exemple suivant utilise mocha-junit-reporter et appelle mocha test directement à l’aide d’un script. Ce script produit la sortie XML JUnit à l’emplacement par défaut de ./test-results.xml.

- script: mocha test --reporter mocha-junit-reporter

Si vous avez défini un script test dans le fichier package.json de votre projet, vous pouvez l’appeler en utilisant npm test.

- script: npm test

Publier les résultats des tests

Pour publier les résultats des tests, utilisez la tâche Publier les résultats des tests .

- task: PublishTestResults@2
  condition: succeededOrFailed()
  inputs:
    testRunner: JUnit
    testResultsFiles: '**/test-results.xml'

Publier les résultats de la couverture du code

Si vos scripts de test exécutent un outil de couverture de code tel qu’Istanbul, ajoutez la tâche Publier les résultats de la couverture du code . Vous pouvez ensuite voir les métriques de couverture dans le résumé de build et télécharger des rapports HTML pour une analyse plus approfondie.

La tâche attend un rapport généré par Cobertura ou JaCoCo. Vérifiez que votre outil de couverture du code s’exécute avec les options nécessaires pour générer la sortie appropriée, par exemple --report cobertura.

YAML

L’exemple suivant utilise l’interface de ligne de commande d’Istanbul nyc avec mocha-junit-reporter et appelle npm test.

- script: |
    nyc --reporter=cobertura --reporter=html \
    npm test -- --reporter mocha-junit-reporter --reporter-options mochaFile=./test-results.xml
  displayName: 'Build code coverage report'

- task: PublishCodeCoverageResults@2
  inputs: 
    summaryFileLocation: '$(System.DefaultWorkingDirectory)/**/*coverage.xml'

Classique

Définissez les options de contrôle de la tâche Publier les résultats des tests pour exécuter la tâche même si une tâche précédente échoue, sauf si le déploiement a été annulé.

Test de navigateur de bout en bout

Votre pipeline peut utiliser des outils tels que Protractor ou Karma pour exécuter des tests dans des navigateurs sans tête, puis publier les résultats des tests. Pour configurer les tests de navigateur et publier des résultats, procédez comme suit :

1. Installez un pilote de test de navigateur sans tête, tel que Chrome sans tête ou Firefox, ou un outil de simulation de navigateur tel que PhantomJS, sur l’agent de build.
2. Configurez votre infrastructure de test pour utiliser votre navigateur ou votre option de pilote sans tête en fonction de la documentation de l’outil.
3. Configurez votre infrastructure de test pour générer des résultats de test au format JUnit, généralement avec un plug-in ou une configuration reporter.
4. Ajoutez un script ou une tâche CLI pour démarrer les instances de navigateur sans tête.
5. Exécutez les tests de bout en bout dans les phases de pipeline avec vos tests unitaires.
6. Publiez les résultats avec vos tests unitaires à l’aide de la même tâche publier les résultats des tests .

Empaquetage et livraison

Après avoir généré et testé votre application, vous pouvez :

• Chargez la sortie de build dans Azure Pipelines.
• Créez et publiez un package npm ou Maven.
• Empaqueter la sortie de build dans une archive ZIP pour le déploiement vers une application web.

Publier des fichiers sur Azure Pipelines

Pour charger l’intégralité du répertoire de travail, ajoutez la tâche Publier les artefacts de build à votre fichier azure-pipelines.yml .

- task: PublishBuildArtifacts@1
  inputs:
    PathtoPublish: '$(System.DefaultWorkingDirectory)'

Pour charger un sous-ensemble de fichiers, commencez par copier les fichiers nécessaires du répertoire de travail vers un répertoire intermédiaire avec la tâche Copier des fichiers , puis utilisez la tâche Publier les artefacts de build .

- task: CopyFiles@2
  inputs:
    SourceFolder: '$(System.DefaultWorkingDirectory)'
    Contents: |
      **\*.js
      package.json
    TargetFolder: '$(Build.ArtifactStagingDirectory)'

- task: PublishBuildArtifacts@1

Publier un module dans un registre npm

Si la sortie de votre projet est un npm module pour d’autres projets à utiliser et n’est pas une application web, utilisez la tâche npm pour publier le module dans un registre local ou dans le registre npm public. Fournissez une combinaison nom/version unique chaque fois que vous publiez.

L’exemple suivant utilise le script pour publier dans le registre npm public. L’exemple suppose que vous gérez les informations de version telles que la version npm via un fichier package.json dans le contrôle de version.

- script: npm publish

L’exemple suivant publie dans un registre personnalisé défini dans le fichier *.npmrc de votre dépôt. Configurez une connexion de service npm pour injecter des informations d’identification d’authentification dans la connexion pendant l’exécution de la build.

- task: Npm@1
  inputs:
     command: publish
     publishRegistry: useExternalRegistry
     publishEndpoint: https://my.npmregistry.com

L’exemple suivant publie le module dans un flux de gestion de package Azure DevOps Services.

- task: Npm@1
  inputs:
     command: publish
     publishRegistry: useFeed
     publishFeed: https://my.npmregistry.com

Pour plus d’informations sur le contrôle de version et la publication de packages npm, consultez Publier des packages npm et Comment puis-je versionr mes packages npm dans le cadre du processus de génération.

Empaqueter et déployer une application web

Vous pouvez empaqueter des applications pour regrouper tous les modules avec des sorties intermédiaires et des dépendances dans des ressources statiques prêtes pour le déploiement. Ajoutez une étape de pipeline après la compilation et le test pour exécuter un outil tel que webpack ou la build Angular CLI ng.

L’exemple suivant appelle webpack. Pour que ce processus fonctionne, assurez-vous webpack qu’il est configuré en tant que dépendance de développement dans votre fichier projet package.json . Ce script s’exécute webpack avec la configuration par défaut, sauf si vous avez un fichier webpack.config.js dans le dossier racine de votre projet.

- script: webpack

L’exemple suivant utilise npm run build pour appeler l’objet build de script défini dans le fichier package.json du projet. L’utilisation de l’objet de script dans votre projet déplace la logique de génération dans le code source et hors du pipeline.

- script: npm run build

Vous pouvez également utiliser la tâche CLI ou Bash dans votre pipeline pour appeler votre outil d’empaquetage, tel que webpack ou ng build d'Angular.

Pour créer une archive de fichiers *.zip prête à être publiée sur une application web, utilisez la tâche Fichiers d’archivage .

- task: ArchiveFiles@2
  inputs:
    rootFolderOrFile: '$(System.DefaultWorkingDirectory)'
    includeRootFolder: false

Pour publier cette archive sur une application web, consultez Déployer sur Azure App Service à l’aide d’Azure Pipelines.

Frameworks JavaScript

Vous pouvez installer des packages dans votre pipeline pour prendre en charge différents frameworks JavaScript.

Angular

Pour les applications Angular, vous pouvez exécuter des commandes spécifiques à Angular telles que ng test, ng buildet ng e2e. Pour utiliser les commandes CLI Angular dans votre pipeline, installez le package npm angular/cli sur l’agent de build.

YAML

- script: |
    npm install -g @angular/cli
    npm install
    ng build --prod

Notes

Sur les agents Linux hébergés par Microsoft, précédez la commande avec sudo, comme sudo npm install -g.

Classique

Dans un pipeline Classique, ajoutez et configurez les tâches suivantes :

• npm

  • Commande : custom
  • Arguments:install -g @angular/cli

• npm

  • Commande : install

• bash

  • Type : inline
  • Script : ng build --prod

Pour les tests dans votre pipeline qui nécessitent l’exécution d’un navigateur, comme l’exécution de Karma avec la ng test commande, utilisez un navigateur sans tête au lieu d’un navigateur standard. Dans l’application de démarrage Angular :

• Remplacez l’entrée browsers dans votre fichier projet karma.conf.js de browsers: ['Chrome'] à browsers: ['ChromeHeadless'].
• Remplacez l’entrée singleRun dans votre fichier projet karma.conf.js de false à true. Cette modification permet de s’assurer que le processus Karma s’arrête après son exécution.

React et Vue

Toutes les dépendances pour les applications React et Vue sont capturées dans votre fichier package.json . Votre fichier azure-pipelines.yml contient les scripts standard npm .

- script: |
    npm install
  displayName: 'npm install'

- script: |
    npm run build
  displayName: 'npm build'

Les fichiers de build se trouvent dans un nouveau dossier, dist pour Vue ou build pour React. L’exemple suivant génère un artefact, wwwqui est prêt pour la mise en production. Le pipeline utilise les tâches Use Node.js, Copy file et Publish build artifacts .

trigger:
- main

pool:
  vmImage: 'ubuntu-latest'

steps:
- task: UseNode@1
  inputs:
    version: '16.x'
  displayName: 'Install Node.js'

- script: npm install
  displayName: 'npm install'

- script: npm run build
  displayName: 'npm build'

- task: CopyFiles@2
  inputs:
    Contents: 'build/**' # Pull the build directory (React)
    TargetFolder: '$(Build.ArtifactStagingDirectory)'

- task: PublishBuildArtifacts@1
  inputs: 
    PathtoPublish: $(Build.ArtifactStagingDirectory) # dist or build files
    ArtifactName: 'www' # output artifact named www

Pour déployer l’application, pointez votre tâche de mise en production vers l’artefact dist ou build et utilisez la tâche Azure Web App.

Webpack

Vous pouvez utiliser un fichier de configuration webpack pour spécifier un compilateur tel que Babel ou TypeScript, pour transpiler le code XML JavaScript (JSX) ou TypeScript en JavaScript brut et regrouper votre application.

YAML

- script: |
    npm install webpack webpack-cli --save-dev
    npx webpack --config webpack.config.js

Classique

Dans un pipeline Classique, ajoutez et configurez les tâches suivantes :

• npm

  • Commande : custom
  • Commande et arguments :install -g webpack webpack-cli --save-dev

• bash

  • Type : inline
  • Script : npx webpack --config webpack.config.js

Exécuteurs de tâches de build

Il est courant d’utiliser Gulp ou Grunt en tant qu’exécuteurs de tâches pour générer et tester des applications JavaScript.

Gulp

Gulp est préinstallé sur les agents hébergés par Microsoft.

YAML

Vous pouvez exécuter la gulp commande dans le fichier de pipeline YAML.

- script: gulp # add any needed options

Si les étapes de votre fichier gulpfile.js nécessitent une authentification auprès d’un registre npm, ajoutez la tâche d’authentification npm .

- task: npmAuthenticate@0
  inputs:
    customEndpoint: <Name of npm service connection>

- script: gulp

Pour publier les résultats des tests JUnit ou xUnit sur le serveur, ajoutez la tâche Publier les résultats des tests .

- task: PublishTestResults@2
  inputs:
    testResultsFiles: '**/TEST-RESULTS.xml'
    testRunTitle: 'Test results for JavaScript using gulp'

Pour publier les résultats de couverture du code sur le serveur, ajoutez la tâche publier les résultats de couverture du code . Vous trouverez les métriques de couverture dans le résumé de la build, et vous pouvez télécharger des rapports HTML pour une analyse plus approfondie.

- task: PublishCodeCoverageResults@1
  inputs: 
    codeCoverageTool: Cobertura
    summaryFileLocation: '$(System.DefaultWorkingDirectory)/**/*coverage.xml'
    reportDirectory: '$(System.DefaultWorkingDirectory)/**/coverage'

Classique

La façon la plus simple de créer un pipeline Classique si votre application utilise Gulp consiste à utiliser l'Node.js avec le modèle de build gulp lorsque vous créez le pipeline. Ce modèle ajoute automatiquement différentes tâches pour appeler des commandes Gulp et publier des artefacts. Dans la tâche, sélectionnez Activer la couverture du code pour activer la couverture du code à l’aide d’Istanbul.

Grunt

Grunt est préinstallé sur les agents hébergés par Microsoft.

YAML

Vous pouvez exécuter la grunt commande dans le fichier YAML.

- script: grunt # add any needed options

Si les étapes de votre fichier Gruntfile.js nécessitent une authentification auprès d’un registre npm, ajoutez la tâche d’authentification npm .

- task: npmAuthenticate@0
  inputs:
    customEndpoint: <Name of npm service connection>

- script: grunt

Classique

La façon la plus simple de créer un pipeline Classique si votre application utilise Grunt consiste à utiliser le modèle de buildNode.js With Grunt lorsque vous créez le pipeline. Ce modèle ajoute automatiquement différentes tâches pour appeler des commandes Gulp et publier des artefacts.

Dans la tâche, sélectionnez l’option Publier sur Azure Pipelines pour publier les résultats des tests, puis sélectionnez Activer la couverture du code pour activer la couverture du code à l’aide d’Istanbul.

Résolution des problèmes

Si vous pouvez créer votre projet sur votre machine de développement, mais que vous ne pouvez pas le générer dans Azure Pipelines, explorez les causes potentielles et les actions correctives suivantes.

• Vérifiez que les versions de Node.js et l’exécuteur de tâches sur votre ordinateur de développement correspondent à celles de l’agent.

  Vous pouvez inclure des scripts de ligne de commande tels que node --version dans votre pipeline pour vérifier les versions installées sur l’agent. Utilisez la Use Node.js tâche pour installer la même version sur l’agent ou exécutez npm install des commandes pour mettre à jour les versions de l’outil.

• Si vos builds échouent par intermittence pendant que vous restaurez des packages, le registre npm présente des problèmes ou il existe des problèmes réseau entre le centre de données Azure et le Registre. Découvrez si l’utilisation d’Azure Artifacts avec un registre npm comme source amont améliore la fiabilité de vos builds.

• Si vous utilisez nvm pour gérer différentes versions de Node.js, envisagez de passer à la tâche Utiliser Node.js (UseNode@1) à la place. nvm est installé sur l'image macOS pour des raisons historiques. nvm gère plusieurs versions de Node.js en ajoutant des alias d'interpréteur de commandes et en modifiant PATH, ce qui réagit mal à la manière dont Azure Pipelines exécute chaque tâche dans un nouveau processus. Pour plus d’informations, consultez Activités du pipeline.

  La Use Node.js tâche gère correctement ce modèle. Toutefois, si votre travail nécessite l’utilisation nvm, vous pouvez ajouter le script suivant au début de chaque pipeline :

  steps:
  - bash: |
      NODE_VERSION=16  # or your preferred version
      npm config delete prefix  # avoid a warning
      . ${NVM_DIR}/nvm.sh
      nvm use ${NODE_VERSION}
      nvm alias default ${NODE_VERSION}
      VERSION_PATH="$(nvm_version_path ${NODE_VERSION})"
      echo "##vso[task.prependPath]$VERSION_PATH"
  

  node et d’autres outils en ligne de commande fonctionnent alors pour le reste du travail de pipeline. À chaque étape où vous utilisez la commande nvm, démarrez le script avec le code suivant :

  - bash: |
      . ${NVM_DIR}/nvm.sh
      nvm <command>
  

Questions fréquentes (FAQ)

Comment résoudre un échec de pipeline avec le message « ERREUR IRRÉCUPÉRABLE : échec de l’allocation CALL_AND_RETRY_LAST - Tas JavaScript hors mémoire » ?

Ce type d’échec se produit lorsque le package Node.js dépasse la limite d’utilisation de la mémoire. Pour résoudre le problème, ajoutez une variable comme NODE_OPTIONS et affectez-la à une valeur de --max_old_space_size=16384.

Comment puis-je versionr mes packages npm dans le cadre du processus de génération ?

L’une des options consiste à utiliser une combinaison de contrôle de version et de version npm. À la fin de l’exécution d’un pipeline, vous pouvez mettre à jour votre dépôt avec la nouvelle version. Le pipeline YAML suivant dispose d’un dépôt GitHub et le package est déployé sur npmjs. La build échoue en cas d’incompatibilité entre la version du package sur npmjs et le fichier package.json .

variables:
    MAP_NPMTOKEN: $(NPMTOKEN) # Mapping secret var

trigger:
- none

pool:
  vmImage: 'ubuntu-latest'

steps: # Checking out connected repo
- checkout: self
  persistCredentials: true
  clean: true
    
- task: npmAuthenticate@0
  inputs:
    workingFile: .npmrc
    customEndpoint: 'my-npm-connection'
    
- task: UseNode@1
  inputs:
    version: '16.x'
  displayName: 'Install Node.js'

- script: |
    npm install
  displayName: 'npm install'

- script: |
    npm pack
  displayName: 'Package for release'

- bash: | # Grab the package version
    v=`node -p "const p = require('./package.json'); p.version;"`
    echo "##vso[task.setvariable variable=packageVersion]$v"

- task: CopyFiles@2
  inputs:
      contents: '*.tgz'
      targetFolder: $(Build.ArtifactStagingDirectory)/npm
  displayName: 'Copy archives to artifacts staging directory'

- task: CopyFiles@2
  inputs:
    sourceFolder: '$(Build.SourcesDirectory)'
    contents: 'package.json' 
    targetFolder: $(Build.ArtifactStagingDirectory)/npm
  displayName: 'Copy package.json'

- task: PublishBuildArtifacts@1 
  inputs:
    PathtoPublish: '$(Build.ArtifactStagingDirectory)/npm'
    artifactName: npm
  displayName: 'Publish npm artifact'

- script: |  # Config can be set in .npmrc
    npm config set //registry.npmjs.org/:_authToken=$(MAP_NPMTOKEN) 
    npm config set scope "@myscope"
    # npm config list
    # npm --version
    npm version patch --force
    npm publish --access public

- task: CmdLine@2 # Push changes to GitHub (substitute your repo)
  inputs:
    script: |
      git config --global user.email "username@contoso.com"
      git config --global user.name "Azure Pipeline"
      git add package.json
      git commit -a -m "Test Commit from Azure DevOps"
      git push -u origin HEAD:main

Contenu connexe

• Pour plus d’informations sur Azure Artifacts et le service gestion des packages, consultez Gestion des packages dans Azure Artifacts.
• Pour plus d’informations sur les tâches, consultez les tâches de construction, de publication et de test.