Problem that yarn install could not be done from npm repository created by Azure DevOps

Preface

I decided to use Azure Artifacts (repository of packages such as gradle, npm) in my project, and when I tried to install the npm package with yarn install, the official method did not work, so I will describe the solution. I will.

Azure official method

According to the official method, you should write the following contents in .npmrc and then install the package. The actual contents of the following two items are described in the automatically generated settings.

[Organazation Name] Organization name created in Azure
[User Name] Azure user name

`.npmrc`


registry=https://pkgs.dev.azure.com/[Organazation Name]/_packaging/internal%40Local/npm/registry/
always-auth=true

; begin auth token
//pkgs.dev.azure.com/[Organazation Name]/_packaging/internal%40Local/npm/registry/:username=[Organazation Name]
//pkgs.dev.azure.com/[Organazation Name]/_packaging/internal%40Local/npm/registry/:_password=[BASE64_ENCODED_PERSONAL_ACCESS_TOKEN]
//pkgs.dev.azure.com/[Organazation Name]/_packaging/internal%40Local/npm/registry/:email=npm requires email to be set but doesn't use the value
//pkgs.dev.azure.com/[Organazation Name]/_packaging/internal%40Local/npm/:username=[User name]
//pkgs.dev.azure.com/[Organazation Name]/_packaging/internal%40Local/npm/:_password=[BASE64_ENCODED_PERSONAL_ACCESS_TOKEN]
//pkgs.dev.azure.com/[Organazation Name]/_packaging/internal%40Local/npm/:email=npm requires email to be set but doesn't use the value
; end auth token

However, I can do npm install with the above method, but I can't do yarn install. The error log output during yarn install is as follows.

$ yarn install

`yarn-error.log`


Trace:
  Error: https://pkgs.dev.azure.com/[Organazation Name]/_packaging/internal@Local/npm/registry/@[Organazation Name]/[Package]/-/[Package]-0.0.1.tgz: Request failed "401 Unauthorized"
      at ResponseError.ExtendableBuiltin (/opt/yarn-v1.22.4/lib/cli.js:696:66)
      at new ResponseError (/opt/yarn-v1.22.4/lib/cli.js:802:124)
      at Request.<anonymous> (/opt/yarn-v1.22.4/lib/cli.js:67057:16)
      at Request.emit (events.js:314:20)
      at Request.module.exports.Request.onRequestResponse (/opt/yarn-v1.22.4/lib/cli.js:141625:10)
      at ClientRequest.emit (events.js:314:20)
      at HTTPParser.parserOnIncomingClient (_http_client.js:640:27)
      at HTTPParser.parserOnHeadersComplete (_http_common.js:119:17)
      at TLSSocket.socketOnData (_http_client.js:509:22)
      at TLSSocket.emit (events.js:314:20)

Cause

You did not specify the repository and authentication method scope in .npmrc.
In the official Azure method, @ is URL-encoded as% 40, but yarn did not decode it.

Solutions

Modify .npmrc with the following points and perform yarn install. [^ 1]

Specify the scope.
Change the part that is% 40 to @.

`After modification.npmrc`


@[Organaization Name]:registry=https://pkgs.dev.azure.com/[Organazation Name]/_packaging/internal@Local/npm/registry/　#scope(@[Organization Name]) Is added.%Where it is 40@Change to, and so on.
@[Organaization Name]:always-auth=true　#scope(@[Organization Name]To attach)

; begin auth token
//pkgs.dev.azure.com/[Organazation Name]/_packaging/internal@Local/npm/registry/:username=[Organazation Name]　#
//pkgs.dev.azure.com/[Organazation Name]/_packaging/internal@Local/npm/registry/:_password=[BASE64_ENCODED_PERSONAL_ACCESS_TOKEN]
//pkgs.dev.azure.com/[Organazation Name]/_packaging/internal@Local/npm/registry/:email=npm requires email to be set but doesn't use the value
//pkgs.dev.azure.com/[Organazation Name]/_packaging/internal@Local/npm/:username=[User name]
//pkgs.dev.azure.com/[Organazation Name]/_packaging/internal@Local/npm/:_password=[BASE64_ENCODED_PERSONAL_ACCESS_TOKEN]
//pkgs.dev.azure.com/[Organazation Name]/_packaging/internal@Local/npm/:email=npm requires email to be set but doesn't use the value
; end auth token

[^ 1]: You can do npm install even with the modified .npmrc.