Azure Artifacts で Npm スコープを使用する

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

Npm スコープは、関連するパッケージをグループに分類する手段として機能します。 これらのスコープを使用すると、競合が発生することなく、異なるユーザーによって作成されたものと同じ名前のパッケージを作成できます。 スコープを使用すると、スコープ プレフィックス @scopeNameを追加し、その特定のスコープでフィードを排他的に使用するように .npmrc ファイルを構成することで、パブリック パッケージとプライベート パッケージを分離できます。

Azure Artifacts には、スコープ付きパッケージとスコープなしパッケージの両方をフィードまたはパブリック レジストリから発行およびダウンロードする機能が用意されています。 Npm スコープは、インターネット にアクセスできないセルフホステッド オンプレミス サーバーを操作する場合に特に価値があります。このようなシナリオではアップストリーム ソースを構成することは不可能です。 要約すると、スコープを使用する場合:

  • 名前の競合について心配する必要はありません。
  • パッケージをインストールまたは発行するために npm レジストリを変更する必要はありません。
  • 各 npm 組織/ユーザーは独自のスコープを持ち、所有者またはスコープ メンバーのみが自分のスコープにパッケージを発行できます。

プロジェクトの設定

  1. Azure DevOps 組織にサインインしてから、プロジェクトに移動します。

  2. [成果物] を選択し、[フィードに接続] を選択します。

    フィードに接続する方法を示すスクリーンショット。

  3. npm を選択し、[その他] を選択します。

  4. .npmrc package.jsonと同じディレクトリにファイルを追加し、次のスニペットをファイルに貼り付けます。

    • 組織スコープのフィード:

      registry=https://pkgs.dev.azure.com/<ORGANIZATION_NAME/_packaging/<FEED_NAME>/npm/registry/
      
      always-auth=true
      
    • プロジェクト スコープ フィード:

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

資格情報を設定する

  1. 次のスニペットをユーザー レベル .npmrc のファイル (例: C:\Users\FabrikamUser.npmrc) にコピーします。 ソース リポジトリ内の .npmrc ファイルに貼り付けないことを確認します。

    • 組織スコープのフィード:

      ; 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
      
    • プロジェクト スコープ フィード:

      ; 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. パッケージ>化の読み取りおよび書き込みスコープを使用して個人用アクセス トークンを生成します。

  3. 次のコマンドを実行して、新しく生成された個人用アクセス トークンをエンコードします。 メッセージが表示されたら、個人用アクセス トークンを貼り付け、結果の Base64 でエンコードされた値をコピーします。

    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. ファイルを .npmrc 開き、プレースホルダー [BASE64_ENCODED_PERSONAL_ACCESS_TOKEN] を、先ほど作成したエンコードされた個人用アクセス トークンに置き換えます。

スコープの設定

.npmrc ファイルで次のように置き換えますregistry=<YOUR_SOURCE_URL>@ScopeName:registry=<YOUR_SOURCE_URL>

次のように、スコープ名とパッケージ名の両方を package.json ファイルに含めるようにしてください { "name": "@ScopeName/PackageName" }。 以下の例を参照してください。

  • 組織スコープのフィード:

    @ScopeName:registry=https://pkgs.dev.azure.com/<ORGANIZATION_NAME>/_packaging/<FEED_NAME>/npm/registry/
    
    always-auth=true
    
    {
    "name": "@ScopeName/PackageName" 
    }
    
  • プロジェクト スコープ フィード:

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

    @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"
      }
    

スコープ付きパッケージを発行する

コマンド プロンプト ウィンドウを開き、プロジェクト ディレクトリに移動し、次のコマンドを実行してスコープ付きパッケージを発行します。 この例では、パッケージがビューの下に @local 一覧表示されます。

npm publish

Azure Artifacts フィード内のスコープ付きパッケージを示すスクリーンショット。

アップストリーム ソースとスコープ

アップストリーム ソースを使用すると、フィードでスコープ付きパッケージとスコープなしパッケージの組み合わせ、および npmjs.com などのパブリック レジストリからのスコープ付きパッケージとスコープなしパッケージの両方を使用する柔軟性が最も高く得られます。

ただし、スコープによってパッケージに名前付け制限が適用されます。各パッケージ名は次で @<scope>始まる必要があります。 プライベート パッケージをパブリック レジストリに発行する場合は、スコープをそのまま使用して発行する必要があります。 パッケージの展開時にパッケージ スコープを削除する場合は、package.json ファイル内のすべての参照を更新する必要があります。 そのことを念頭に置いて、スコープはアップストリーム ソースの実行可能な代替手段として機能できます。