NPM Package Type and Jenkins Integration in JFrog Artifactory

Quickly understand the simple process of how to create local, remote, and virtual repositories with NPM package type and integration of Artifactory with Jenkins through step-by-step screenshots:

In the previous tutorial, we saw how to use the generic and docker package type. At the last part, we will look at the NPM package type and integration of Artifactory with Jenkins.

For the NPM package type, we will do the following:

• Create local repository
• Create remote repository
• Create a virtual repository with the combination of the first 2 repositories

=> Series of Simple JFrog Tutorials

NPM Package Type & Jenkins Integration – Complete Guide

NPM Package Type

Create a Local Repository

Local repository is a central location to upload and store your artifacts generated by builds. To create a local repository as an Admin user, select Administration TAB -> Repositories. Now click on + Add Repository in the top right and select Local Repository.

Select NPM as the package type.

Enter the Repository Key and click on Create Local Repository.

Create Remote Repository

Remote repository is the cache of a repository that is managed remotely. Let’s look at how to create the maven remote repository.

As an Admin user, select Administration TAB -> Repositories. Now click on + Add Repository –> Remote Repository in the top right. Select the NPM package type and enter the details as shown below.

Click on Create Remote Repository.

Create Virtual Repository

A virtual repository is a combination of both local and remote repositories having a common endpoint. To create a Virtual repository as an Admin user, select Administration TAB -> Repositories. Now click on + Add Repository -> Virtual Repository in the top right. Select NPM.

Add local and remote repositories and also set the Default deployment repository to the local repository.

Click on Create Virtual Repository

JFrog Artifactory NPM Example

In this section, we will look at how to initialize from the remote repository and publish it to the local repository.

To set up, a user goes to Application TAB -> Artifactory -> Artifacts. Search for the Virtual repository and click on Set Me Up.

Copy the snippet to the .npmrc file.

The file location of .npmrc file

Windows systems: %userprofile%\.npmrc

Linux systems: ~/.npmrc

Package.json file setup

Go to the Publish section of the Virtual Repository Set Me Up and add the publishConfig snippet as per your virtual repository setup to the package.json file.

“publishConfig”:{“registry”:”https://vniranjan2512.jfrog.io/artifactory/api/npm/niranjan-npm-virtual/”}

Run ‘npm publish’

Artifacts are uploaded to the npm local repository in Artifactory.

Using Jenkins

Suggested Reading =>> How to Download and Install Jenkins

Docker Build and Publish Image to JFrog Artifactory as a Docker Registry

This section focuses on Docker Build and Publish images to JFrog Artifactory as a Docker Registry. Here is a brief overview of the steps involved in automation:

1. GitHub repository containing Dockerfile and other files used in the Dockerfile
2. Install Docker Build and Publish the Jenkins plugin from here.
3. Create a virtual repository in JFrog Artifactory.
4. Create a Jenkins Node for the Docker build and publish to run.
5. Setup Jenkins pipeline.

Install Docker Build and Publish Jenkins plugin

As an admin user of Jenkins go to the Manage Jenkins -> Manage Plugin section to install the plugin.

Create a Virtual Repository Docker in Artifactory

Reuse the same Virtual Docker repository created in part 2. The steps to create a Virtual repository and include the local/remote repository can be seen in part 2 of the series.

Create a Jenkins Node

To create a Jenkins Node, go to Manage Jenkins -> Manage Nodes and Clouds

Click on + New Node.

Add the details needed for creating and launching the node. We will use EC2 Linux ubuntu VM. Provide a Remote root directory.

Scroll down, add the Host IP of the EC2 VM, and add credentials.

My username is ubuntu which is the login of my AWS Ec2 VM. The private Key can be copied from the file below from the slave machine.

# cat /home/ubuntu/.ssh/id_rsa

Next, add the Host Key Verification Strategy. Select the option Manually provided key Verification Strategy. For SSH Key enter the value from ssh_host_rsa_key.pub file from /etc/ssh directory. Click on Save.

Save and launch the node and you should see a successfully connected message.

Create a Jenkins job

Before we create a Jenkins job, let’s log in to the Artifactory Docker registry in the node VM.

In the Jenkins dashboard, click on + New Item and select Freestyle project. Enter the node details for the job to run and the GitHub repo details.

Scroll down and add Build step -> Docker Build and Publish.

Add the details as shown based on your Artifactory environment.

Click on Save and Build the jenkins job. The image is built and pushed to the JFrog Artifactory Docker local repository.

Maven Build and Deploy to JFrog Artifactory

This section focuses on how to integrate Jenkins with JFrog Artifactory to do Maven Build and Deploy. To perform this here are the pre-requisites:

1. GitHub repo containing the Maven code
2. Jenkins agent. Will reuse from the earlier section
3. Java/Maven installed on the agent machine
4. Create JFrog Artifactory Virtual repository
5. JFrog Artifactory Virtual repository Set Me Up is used to set up settings.xml and pom.xml files on your build machines. This is covered in Part 1 of the series.

Create a Jenkins job

Create a Jenkins Freestyle job. In the Jenkins dashboard click on + New Item and select Freestyle project. Enter the node details for the job to run and the GitHub repo details.

Next is to add the Build step. Invoke Artifactory Maven 3. Add this step twice, one for build and the other to upload to Artifactory.

Click on Save and trigger the build. The WAR file is uploaded to the local repository on a successful build.

NPM Install and Publish

This section focuses on how to integrate Jenkins with JFrog Artifactory to do npm install and publish.

To perform this, here are the pre-requisites:

1. GitHub repo containing the npm code
2. Jenkins agent. Will reuse from the earlier section
3. Node and npm installed on the agent machine
4. Create JFrog Artifactory Virtual repository
5. JFrog Artifactory Virtual repository Set Me Up is used to set up .npmrc and package.json files.

Create a Jenkins job

Create a Jenkins Freestyle job. In the Jenkins dashboard click on + New Item and select Freestyle project. Enter the node details for the job to run and the GitHub repo details.

Add the Build Step -> Execute shell

Add the ‘ npm install’ and ‘npm publish’ commands.

Also added a Post-build Actions=> Execute scripts. Call the run.sh script.

run.sh script

This will just run the command ‘node index.js’

Save the job and trigger the build.

Further reading => Integrate Selenium with Maven project

Conclusion

In this tutorial, we looked at the NPM Package type and how we use the Artifactory plugin with Jenkins and its example of maven, npm, and docker. This article focused on both of the package types, with an example of both upload and download.

In the upcoming tutorial, we will look at how to use JFrog Artifactory for Gradle and GO Package type and how we use the Artifactory plugin with Jenkins.

PREV Tutorial | NEXT Tutorial