Utiliser des étendues Npm dans Azure Artifacts

Azure DevOps Services | Azure DevOps Server 2022 | Azure DevOps Server 2019

Les étendues Npm servent de moyen de catégoriser les packages associés en groupes. Ces étendues vous permettent de créer des packages avec des noms identiques à ceux créés par différents utilisateurs sans rencontrer de conflits. En utilisant des étendues, vous avez la possibilité de séparer les packages publics et privés en ajoutant le préfixe d’étendue @scopeName et en configurant le fichier .npmrc pour utiliser exclusivement un flux avec cette étendue particulière.

Azure Artifacts offre la possibilité de publier et de télécharger des packages délimités et non étendus à partir de flux ou de registres publics. Les étendues Npm sont particulièrement utiles lorsque vous travaillez avec des serveurs locaux auto-hébergés sans accès à Internet, car la configuration de amont sources dans de tels scénarios n’est pas réalisable. En résumé, lors de l’utilisation d’étendues :

  • Nous n’avons pas à nous soucier des collisions de noms.
  • Il n’est pas nécessaire de modifier le registre npm pour installer ou publier nos packages.
  • Chaque organisation/utilisateur npm a sa propre étendue, et seul le propriétaire ou les membres de l’étendue peuvent publier des packages dans leur étendue.

Configuration du projet

  1. Connectez-vous à votre organisation Azure DevOps puis accédez à votre projet.

  2. Sélectionnez Artefacts, puis sélectionnez Connecter à alimenter.

    Capture d’écran montrant comment se connecter à un flux.

  3. Sélectionnez npm, puis sélectionnez Autre.

  4. Ajoutez un .npmrc fichier dans le même répertoire que votre package.json, puis collez l’extrait de code suivant dans votre fichier.

    • Flux d’étendue de l’organisation :

      registry=https://pkgs.dev.azure.com/<ORGANIZATION_NAME/_packaging/<FEED_NAME>/npm/registry/
      
      always-auth=true
      
    • Flux dans l’étendue du projet :

      registry=https://pkgs.dev.azure.com/<ORGANIZATION_NAME>/<PROJECT_NAME>/_packaging/<FEED_NAME>/npm/registry/
      
      always-auth=true
      

Configurer les informations d’identification

  1. Copiez l’extrait de code suivant dans votre fichier au niveau .npmrc de l’utilisateur (exemple : C :\Users\FabrikamUser.npmrc). Veillez à ne pas le coller dans le fichier .npmrc dans votre référentiel source.

    • Flux d’étendue de l’organisation :

      ; begin auth token
      //pkgs.dev.azure.com/<ORGANIZATION_NAME>/_packaging/<FEED_NAME>/npm/registry/:username=[ENTER_ANY_VALUE_BUT_NOT_AN_EMPTY_STRING]
      //pkgs.dev.azure.com/<ORGANIZATION_NAME>/_packaging/<FEED_NAME>/npm/registry/:_password=[BASE64_ENCODED_PERSONAL_ACCESS_TOKEN]
      //pkgs.dev.azure.com/<ORGANIZATION_NAME>/_packaging/<FEED_NAME>/npm/registry/:email=npm requires email to be set but doesn't use the value
      //pkgs.dev.azure.com/<ORGANIZATION_NAME>/_packaging/<FEED_NAME>/npm/:username=[ANY_VALUE_BUT_NOT_AN_EMPTY_STRING]
      //pkgs.dev.azure.com/<ORGANIZATION_NAME>/_packaging/<FEED_NAME>/npm/:_password=[BASE64_ENCODED_PERSONAL_ACCESS_TOKEN]
      //pkgs.dev.azure.com/<ORGANIZATION_NAME>/_packaging/<FEED_NAME>/npm/:email=npm requires email to be set but doesn't use the value
      ; end auth token
      
    • Flux dans l’étendue du projet :

      ; begin auth token
      //pkgs.dev.azure.com/<ORGANIZATION_NAME>/<PROJECT_NAME>/_packaging/<FEED_NAME>/npm/registry/:username=[ENTER_ANY_VALUE_BUT_NOT_AN_EMPTY_STRING]
      //pkgs.dev.azure.com/<ORGANIZATION_NAME>/<PROJECT_NAME>/_packaging/<FEED_NAME>/npm/registry/:_password=[BASE64_ENCODED_PERSONAL_ACCESS_TOKEN]
      //pkgs.dev.azure.com/<ORGANIZATION_NAME>/<PROJECT_NAME>/_packaging/<FEED_NAME>/npm/registry/:email=npm requires email to be set but doesn't use the value
      //pkgs.dev.azure.com/<ORGANIZATION_NAME>/<PROJECT_NAME>/_packaging/<FEED_NAME>/npm/:username=[ENTER_ANY_VALUE_BUT_NOT_AN_EMPTY_STRING]
      //pkgs.dev.azure.com/<ORGANIZATION_NAME>/<PROJECT_NAME>/_packaging/<FEED_NAME>/npm/:_password=[BASE64_ENCODED_PERSONAL_ACCESS_TOKEN]
      //pkgs.dev.azure.com/<ORGANIZATION_NAME>/<PROJECT_NAME>/_packaging/<FEED_NAME>/npm/:email=npm requires email to be set but doesn't use the value
      ; end auth token
      
  2. Générez un jeton d’accès personnel avec des étendues de lecture et d’écriture d’empaquetage>.

  3. Exécutez la commande suivante pour encoder votre jeton d’accès personnel nouvellement généré. Lorsque vous y êtes invité, collez votre jeton d’accès personnel, puis copiez la valeur codée en Base64 résultante.

    node -e "require('readline') .createInterface({input:process.stdin,output:process.stdout,historySize:0}) .question('PAT> ',p => { b64=Buffer.from(p.trim()).toString('base64');console.log(b64);process.exit(); })"
    
  4. Ouvrez votre .npmrc fichier et remplacez l’espace réservé [BASE64_ENCODED_PERSONAL_ACCESS_TOKEN] par votre jeton d’accès personnel encodé que vous venez de créer.

Configuration de l’étendue

Dans votre fichier .npmrc, remplacez registry=<YOUR_SOURCE_URL> par @ScopeName:registry=<YOUR_SOURCE_URL>.

Veillez à inclure les noms d’étendue et de package dans votre fichier package.json comme suit : { "name": "@ScopeName/PackageName" } Consultez les exemples ci-dessous :

  • Flux d’étendue de l’organisation :

    @ScopeName:registry=https://pkgs.dev.azure.com/<ORGANIZATION_NAME>/_packaging/<FEED_NAME>/npm/registry/
    
    always-auth=true
    
    {
    "name": "@ScopeName/PackageName" 
    }
    
  • Flux dans l’étendue du projet :

    @ScopeName:registry=https://pkgs.dev.azure.com/<ORGANIZATION_NAME>/<PROJECT_NAME>/_packaging/<FEED_NAME>/npm/registry/
    
    always-auth=true
    
    {
    "name": "@ScopeName/PackageName" 
    }
    
  • Exemple :

    @local:registry=https://pkgs.dev.azure.com/FabrikamOrg/NpmDemo/_packaging/FabrikamFeed/npm/registry/
    
    always-auth=true
    
    {
      "name": "@demo/js-e2e-express-server",
      "version": "2.0.0",
      "description": "JavaScript server written with Express.js",
      "main": "index.js",
      "directories": {
        "doc": "docs",
        "test": "test"
      }
    

Publier des packages délimités

Ouvrez une fenêtre d’invite de commandes, accédez à votre répertoire de projet et exécutez la commande suivante pour publier votre package étendu. Dans notre exemple, notre package est répertorié sous la @local vue.

npm publish

Capture d’écran montrant un package délimité dans un flux Azure Artifacts.

Sources en amont et étendues

Les sources en amont vous offrent la plus grande flexibilité d’utiliser une combinaison de packages délimités et non étendus dans votre flux, ainsi que des packages délimités et non étendus à partir de registres publics tels que npmjs.com.

Toutefois, les étendues imposent une restriction d’affectation de noms à vos packages : chaque nom de package doit commencer par @<scope>. Si vous souhaitez publier vos packages privés sur des registres publics, vous devez le faire avec les étendues intactes. Si vous supprimez des étendues de package lors du déploiement de vos packages, vous devez mettre à jour toutes les références dans votre fichier package.json . Dans cet esprit, les étendues peuvent servir d’alternative viable à amont sources.