A successful run of the pipeline in this quickstart looks like this:
Before trying this quickstart, ensure that you have:
https://registry.npmjs.org
. Artifacts (such as TGZ files) requested from a remote repository are cached on demand.Perform the steps below to build and push your npm image:
The Pipelines DSL for this example is available in the npm-example repository in the JFrog GitHub account.
The DSL file is a yaml file that contains the pipeline definitions. This example uses two yaml files:
pipelines.yml
, which contains the declarations for all the resources and workflow steps required to run the pipeline.values.yml
, which contains the values required for the pipelines.yml file.For a full breakup of all the resources, pipelines and steps used in the yml file, see the pipelines.yml section below.
Fork this repository to your account or organization. This is important since you need admin access to repositories that are used as Pipeline Sources or GitRepo resources, in order to add webhooks to these repositories and listen for change events.
a. Go to Administration | Pipelines | Integrations to add two integrations:
b. Write down the names of both GitHub and Artifactory integrations as these are required for the next step. Ensure that the names are unique and easy to remember.
The pipelines configuration is available in the values.yml
file. Edit this file in your fork of this repo and replace the following:
Tag | Description | Example |
---|---|---|
| Provide the name of the Github integration you added in the previous step. |
|
| Provide the path to your fork of this repository. |
|
Edit the pipelines.yml
file and replace the following:
Tag | Description | Example |
---|---|---|
| Provide your Artifactory integration. |
|
| Provide the name of the npm repository in Artifactory. |
|
All pipeline definitions are global across JFrog Pipelines within a Project. The names of your pipelines and resources need to be unique within the Project in JFrog Pipelines. |
The Pipeline Source represents the git repository where our pipelines definition files are stored. A pipeline source connects to the repository through an integration, which we added in step 3.
In your left navigation bar, go to Administration | Pipelines | Pipeline Sources. Click on Add a Pipeline Source and then choose From YAML. Follow instructions to add a Pipeline Source. This automatically adds your configuration to the platform and pipelines are created based on your YAML.
An example of adding a pipeline source is shown below. Please ensure that the Repository Full Name points to your forked repository and the Pipeline Config File Filter is entered correctly as (pipelines|values).yml so that both your config files are included.
After your Pipeline Source is synced successfully, navigate to Pipelines | My Pipelines in the left navbar to see the newly added pipeline. In this example, npm_example_pipeline_jfp
is the name of our pipeline. Click the name of the pipeline. This renders a real-time, interactive, diagram of the pipeline and the results of its most current run.
You can trigger the pipeline by committing a change to your repository, or by manually triggering it through the UI. The steps in the pipeline execute in sequence. Multiple steps can execute in parallel if the node pool has multiple build nodes available.
Once the pipeline has completed, a new run is listed.
The pipelines.yml
file is made up of resources, pipelines and steps, as shown below:
This example uses the following types of resources:
GitRepo
A GitRepo resource is used to connect JFrog Pipelines to a source control repository. Adding it creates a webhook to the repo so that future commits will automatically create a new version with the webhook payload.
- name: npm_example_repo_jfp type: GitRepo configuration: # SCM integration where the repository is located gitProvider: {{ .Values.myRepo.gitProvider }} # Repository path, including org name/repo name path: {{ .Values.myRepo.path }} branches: # Specifies which branches will trigger dependent steps include: master |
Tag | Description | Required/Optional |
---|---|---|
name |
This name is used to refer to the resource in steps, and must be unique across all repositories in your JFrog Pipelines environment. | Required |
| The name of the GitHub Integration. Its value is retrieved from the values.yml file. | Required |
path | The path of the repository from the integration root. Its value is retrieved from the values.yml file. | Required |
branches |
The | Optional |
BuildInfo
BuildInfo is automatically created when the NpmBuild step is used to generate packages. BuildInfo is then published to the configured Artifactory repo (sourceArtifactory: demoArt
) by providing that resource in the NpmPublish step.
- name: npm_example_buildinfo_jfp type: BuildInfo configuration: sourceArtifactory: demoArt |
Tag | Description | Required/Optional |
---|---|---|
name |
This name is used to refer to the resource in steps, and must be unique across all repositories in your JFrog Pipelines environment. | Required |
| The name of the Artifactory Integration. Its value is retrieved from the values.yml file. | Required |
npm_example_pipeline_jfp
is the name of the pipeline, which contains the steps for running the pipeline.
The npm_example_pipeline_jfp
pipeline contains the following native steps:
NpmBuild
The NpmBuild native step builds an npm source. This step automatically performs npm-install
on the source in a Git repository.
- name: npm_build_step type: NpmBuild configuration: repositoryName: npm-virtual # required, npm repository name on artifacctory sourceLocation: ./npm-example # required, location of package.json file integrations: - name: demoArt # required inputResources: - name: npm_example_repo_jfp # required |
Tag | Description of usage | Required/Optional |
---|---|---|
name | npm_build_step is the name that identifies the step.This is the name used when the step is assigned as an input to the next step, npm_publish_step. | Required |
repositoryName | npm-virtual is the name of the npm repository in Artifactory. | Required |
sourceLocation | ./npm-example is the directory containing the package.json file, relative to the GitRepo path . | Required |
integrations | Specifies an Artifactory Integration where modules will be published. If a FileSpec resource is specified in inputResources then this is optional. Otherwise, it is required. | May be required |
inputResources | Must specify a GitRepo resource. The This step accepts | Required Optional |
NpmPublish
The NpmPublish step publishes an npm package to the registry in Artifactory following an NpmBuild step.
- name: npm_publish_step type: NpmPublish configuration: # for payloadType npm: repositoryName: npm-virtual # required, npm repository name on artifactory autoPublishBuildInfo: true # optional integrations: - name: demoArt # required inputSteps: - name: npm_build_step # required outputResources: - name: npm_example_buildinfo_jfp # optional |
Tag | Description of usage | Required/Optional |
---|---|---|
name | npm_publish_step is the name that identifies the step. | Required |
repositoryName |
| Required |
autoPublishBuildInfo | When set to true, publishes build info to Artifactory. Default is false. Once published, the build info can be viewed in Artifactory, in the Build Browser under Builds. | Optional |
integrations | Must specify an Artifactory Integration. | Required |
inputSteps | Must specify a named NpmBuild or Bash step.
| Required |
outputResources | Must specify a BuildInfo resource if
| May be required |