Setup

Add a .npmrc to your project, in the same directory as your package.json

; For external packages, i.e. from npmjs.com
registry=https://pkgs.dev.azure.com/if-it/_packaging/common-external-packages/npm/registry/
; For our css components, to be deprecated
@if-design-system:registry=https://pkgs.dev.azure.com/if-it/40e35854-e791-490e-bec8-da33c65c3187/_packaging/if-design-system/npm/registry/
; For our React components, to be deprecated
@if-design-components-react:registry=https://pkgs.dev.azure.com/if-it/40e35854-e791-490e-bec8-da33c65c3187/_packaging/if-design-system/npm/registry/
@ids-js:registry=https://pkgs.dev.azure.com/if-it/40e35854-e791-490e-bec8-da33c65c3187/_packaging/if-design-system/npm/registry/
; For our web components
@ids-wc:registry=https://pkgs.dev.azure.com/if-it/40e35854-e791-490e-bec8-da33c65c3187/_packaging/if-design-system/npm/registry/
; For our css components
@ids-core:registry=https://pkgs.dev.azure.com/if-it/40e35854-e791-490e-bec8-da33c65c3187/_packaging/if-design-system/npm/registry/
; For our react components
@ids-react:registry=https://pkgs.dev.azure.com/if-it/40e35854-e791-490e-bec8-da33c65c3187/_packaging/if-design-system/npm/registry/
; Use this if you still use older versions of the packages
@guybrush:registry=https://waypoint.myget.org/F/relax/auth/f9d9d4a0-b43f-4925-9d6c-424360fbc698/npm/
always-auth=true

Set up credentials

Windows

Run vsts-npm-auth in any directory to get an Azure Artifacts token added to your USER (~/.npmrc) .npmrc file

$ npm install -g vsts-npm-auth --registry https://registry.npmjs.com --always-auth false
$ vsts-npm-auth -config .npmrc

If you're getting errors like: could not find part of path, use the TargetConfig option:

$ vsts-npm-auth -config .npmrc -TargetConfig ~/.npmrc
Note

You don't need to do this every time. npm will give you a 401 Unauthorized error when you need to run it again.

Having issues? See the instructions for using a Personal Access Token to authenticate.

Linux/Other

1. Create .npmrc-files

Copy the code below to your USER (~/.npmrc) .npmrc .

//pkgs.dev.azure.com/if-it/40e35854-e791-490e-bec8-da33c65c3187/_packaging/if-design-system/npm/registry/:username=if-it
//pkgs.dev.azure.com/if-it/40e35854-e791-490e-bec8-da33c65c3187/_packaging/if-design-system/npm/registry/:_password=[BASE64_ENCODED_PERSONAL_ACCESS_TOKEN]
//pkgs.dev.azure.com/if-it/40e35854-e791-490e-bec8-da33c65c3187/_packaging/if-design-system/npm/registry/:email=email
//pkgs.dev.azure.com/if-it/40e35854-e791-490e-bec8-da33c65c3187/_packaging/if-design-system/npm/:username=if-it
//pkgs.dev.azure.com/if-it/40e35854-e791-490e-bec8-da33c65c3187/_packaging/if-design-system/npm/:_password=[BASE64_ENCODED_PERSONAL_ACCESS_TOKEN]
//pkgs.dev.azure.com/if-it/40e35854-e791-490e-bec8-da33c65c3187/_packaging/if-design-system/npm/:email=email
//pkgs.dev.azure.com/if-it/_packaging/common-external-packages/npm/registry/:username=if-it
//pkgs.dev.azure.com/if-it/_packaging/common-external-packages/npm/registry/:_password=[BASE64_ENCODED_PERSONAL_ACCESS_TOKEN]
//pkgs.dev.azure.com/if-it/_packaging/common-external-packages/npm/registry/:email=email
//pkgs.dev.azure.com/if-it/_packaging/common-external-packages/npm/:username=if-it
//pkgs.dev.azure.com/if-it/_packaging/common-external-packages/npm/:_password=[BASE64_ENCODED_PERSONAL_ACCESS_TOKEN]
//pkgs.dev.azure.com/if-it/_packaging/common-external-packages/npm/:email=email
2. Create a Personal Access Token

Generate a Personal Access Token with Packaging read & write scopes.

Press "New Token"

Fill out the required information.

3. Base64 the PAT

Base64 encode the personal access token from Step 2.

One safe and secure method of Base64 encoding a string is to:

  1. From a command/shell prompt run:
$ 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(); })"
  1. Paste your personal access token value and press Enter/Return
  2. Copy the Base64 encoded value

Replace all [BASE64_ENCODED_PERSONAL_ACCESS_TOKEN] values in your USER (~/.npmrc) .npmrc file with your personal access token from Step 3.

This will enable you to install @ids-core-scoped packages from our private registry.

Note

We strongly urge you to use environmental variables for usage of the password in your local .npmrc file or any build pipeline npm config!

Azure Devops Pipelines (Windows or Linux agents)

If you want to access ids-core packages in your pipeline, you don't need a PAT if your project is under the if-it organization in Azure Devops.

  1. Make sure your project allows using external resources. Otherwise you will get a 404 error when your pipeline tries to fetch any external packages. Turn these settings off under Project settings (lower left corner in DevOps) -> Pipelines -> Settings -> General:
Project settings "Limit job authorization scope to current project" must be off
  1. Add npmAuthenticate to your pipeline YAML, before any npm commands:
- task: npmAuthenticate@0
  displayName: 'npm authenticate within if-it'
  inputs:
    workingFile: path/to/your/.npmrc      # You can use the version of .npmrc that doesn't contain any PATs
  1. Now any npm commands such as install in your Azure DevOps pipeline are able to use packages from ids-core!

Table of Contents

Edit this section, Opens in new window
Contact us, Opens in new window