Skip to content
ZenAdmin Tech

Automated NPM Publishing with GitHub Actions

The charizard repository, our internal UI React library, leverages GitHub Actions for continuous integration and deployment. A key aspect of this process is the automated publishing of the library to NPM upon specific triggers.

GitHub Actions Workflow

The GitHub Actions workflow in the charizard repository is designed to publish the library to NPM. The workflow is triggered on push events to tags that match the v* pattern and on pull requests to any branch.

Workflow Details

name: Publish to npm


on:
  push:
    tags:
      - 'v*'
  pull_request:
    branches: ['*']
# Environment variables and jobs follow...

This workflow includes several key steps:

  1. Setting Up the Repository: Checks out the code and sets up pnpm.
  2. Node Setup: Configures Node.js with the specified version and NPM registry.
  3. Package Installation: Installs all necessary packages using pnpm.
  4. Building the Library: Runs the build script to compile the library.
  5. Publishing to NPM: Publishes the package to NPM using the provided authentication token.
  6. Slack Notifications: Sends a notification to a Slack channel indicating the success or failure of the build and publish process in the #alerts-deploy channel

CI/CD Pipeline Objectives

  • Automated Publishing: Automates the release process of the Charizard library, ensuring that new versions are readily available.
  • Consistent Builds: Maintains consistency and reliability in the build process.
  • Real-time Notifications: Provides real-time feedback to the team through Slack notifications.

Consuming the Library in Hybr1d Frontend

Once published to NPM, the charizard library is consumed by the hybr1d-frontend repository. This integration ensures that the frontend team can quickly leverage the latest features and fixes from the Charizard library.