Releasing/Obtaining a Self-Hosted npm Component via a Build Task

Prerequisites

1. You already have a project. If no project is available, create one.
2. You have created a self-hosted npm repo.
3. You have permissions for the current self-hosted repo. For details, see Managing User Permissions.

Releasing a Component to a Self-Hosted npm Repo

1. Download the configuration file of the self-hosted repo.
   1. Log in to the CodeArts homepage and access the npm self-hosted repo for npm. Click Settings in the upper right corner and record the repository address.

      

      

   2. Click Cancel to return to the self-hosted repo page. Click on the right of the page and choose Set Me Up from the drop-down list.

      

   3. In the dialog box that is displayed, click Download Configuration File.

      

   4. Save the downloaded npmrc file as an .npmrc file.

2. Configure a code repository.
   1. Go to CodeArts Repo and create a Node.js repository. For details, see Cloud Repository Creation. This procedure uses the Nodejs Webpack Demo template.
   2. Go to the code repository and upload the .npmrc file to the root directory of the code repository.

      

   3. Find the package.json file in the code repository and open it. Add the repository address recorded on the Edit Repository page to the name field in the file.

      

      

      If the name field cannot be modified, add the address to the Include Patterns field on the Edit Repository page.

3. Configure and execute a build task.
   1. On the code repository page, click Create Build Task in the upper right. The Create Task page is displayed.

      Select Blank build template and click OK.

   2. Add the Build with npm action.

      

   3. Edit the Build with npm action.
      • Select the desired tool version. In this example, nodejs12.7.0 is used.
      • Delete the existing commands and run the following instead:

        export PATH=$PATH:/root/.npm-global/bin
        npm config set strict-ssl false
        npm publish

      

   4. Click Create and Run to start the build task.

      After the task is successfully executed, go to the self-hosted repo and find the uploaded npm component.

      

Obtaining a Dependency from a Self-Hosted npm Repo

The following procedure uses the npm component released in Releasing a Component to a Self-Hosted npm Repo as an example to describe how to obtain a dependency from a self-hosted npm repo.

1. Configure a code repository.
   1. Go to CodeArts Repo and create a Node.js repository. For details, see Cloud Repository Creation. This procedure uses the Nodejs Webpack Demo template.
   2. Obtain the .npmrc file (see Releasing a Component to a Self-Hosted npm Repo) and upload it to the root directory of the code repository where the npm dependency is to be used.
   3. Find and open the package.json file in the code repository, and configure the dependency to the dependencies field. In this document, the value is as follows:

      "@test/vue-demo": "^1.0.0"

      

2. Configure and execute a build task.
   1. On the code repository page, click Create Build Task in the upper right. The Create Task page is displayed.

      Select Blank build template and click OK.

   2. Add the Build with npm action.

      

   3. Edit the Build with npm action.
      • Select the desired tool version. In this example, nodejs12.7.0 is used.
      • Delete the existing commands and run the following instead:

        export PATH=$PATH:/root/.npm-global/bin
        npm config set strict-ssl false
        npm install --verbose

      

3. Click Create and Run to start the build task.

   After the task is successfully executed, view the task details. If information similar to the following is found in the log, the dependency has been downloaded from the self-hosted repo.

   

npm Commands

When configuring build tasks, you can also run the following npm commands as required:

• Delete an existing component from a self-hosted repo.

  npm unpublish @socpe/packageName@version

• Obtain tags.

  npm dist-tag list @scope/packageName

• Add a tag.

  npm dist-tag add @scope/packageName@version tagName --registry registryUrl --verbose

• Delete a tag.

  npm dist-tag rm @scope/packageName@version tagName --registry registryUrl --verbose

Command parameter description:

• scope: path of a self-hosted repo. For details about how to obtain the path, see Releasing a Component to a Self-Hosted npm Repo.
• packageName: the part following scope in the name field of the package.json file.
• version: value of the version field in the package.json file.
• registryUrl: URL of the self-hosted repo referenced by scope in the configuration file.
• tagName: tag name.

The following uses the self-hosted component released in Releasing a Component to a Self-Hosted npm Repo as an example:

• scope: test
• packageName: vue-demo
• version: 1.0.0

The command for deleting this component is as follows:

npm unpublish @test/vue-demo@1.0.0