Private NPM Package deployment using VSTS

How to publish and consume NPM packages with VSTS

In my previous article, I explained how you can automate the deployment of your internal Nuget packages using VSTS and how to consume them. Today, I’m going to show you how you can use a very similar setup to build, deploy and consume NPM package all within VSTS.

We will create a simple package that will allow us to audit our function calls. In reality, it is just going to print it out to the console; probably not a practical example but it will suffice for this article.

Prerequisites:

Install Node.js and NPM

Some experience with Node.js and NPM packages

You will need Visual Studio Code

VSTS account (sign up at visualstudio.com)

Ensure you have the Package Manager Extension installed on VSTS

Our NPM package

Open up VS Code and let’s create our project, as_audit_trail

run the command

npm init -y

The -y flag means that it will construct the package.json for us and populates some of it to help us get started.

Okay I’ve exported a simple function called audit which just prints out the input.

Okay, let’s look at our package.json

I’ve customized some of the default information generated by the -y flag.

Connecting our feed

Head over to your VSTS account and let’s create our feed.

You should have the package extension already installed within your VSTS tenancy. Now head over to the Builds and Releases — Packages

Let’s create a new feed:

I have left the defaults as they are here.

Now we connect to our feed…

As you can see, VSTS already gives us instructions on how to setup our development environment with our feed.

Let’s run the following command to add the feed to our .npmrc file

Let’s navigate to your home folder (where we will find our .npmrc file)

cd ~

run

code .\.npmrc

add the following (copy it from your feed) the file and save

registry=https://[your_account].pkgs.visualstudio.com/_packaging/internal-repo/npm/registry/

always-auth=true

now call

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

and finally

vsts-npm-auth -config .npmrc

you should be presented with a window to authenticate yourself.

Note: As a team, you will all need to go through a similar setup to ensure that you are connected to the feed.

Now you have your feed setup. Let’s publish our NPM package manually; run

npm publish

After it’s successfully published it, navigate to your feed and you should see it there