DEV Community

SebasQuiroga
SebasQuiroga

Posted on • Updated on

A Playful Guide to Publishing and Installing NodeJS Packages on GitHub Packages πŸš€

Publishing a NodeJS package to GitHub Packages is a really exciting journey. 🌌 In this short and whimsical article, we'll take you through the process of not just publishing your package but also installing it from another project with an extra dash of excitement! πŸŽ‰

1.Publish It to the GitHub Packages Constellation πŸ“¦

Once you've validated the awesomeness of your package through successful builds, packs, and seamless imports into other projects, it's time to elevate it to the GitHub Packages cosmos. 🌠

a. Update Your Package Manifest

Open your package.json and append the following snippet:

"publishConfig": {
  "registry": "https://npm.pkg.github.com/@YOUR_ORG_OR_GITHUB_PROFILE"
},

Enter fullscreen mode Exit fullscreen mode

b. Let the GitHub Workflow Unfold

Now, let's add a dash of automation by introducing a GitHub workflow. Create a folder at the project's root: .github/workflows and save the file. If you don't have a creative name, we get you cover: publishingWorkflow.yml πŸ˜‹.

name: Publishing My Awesome Package!
on:
  push:
    branches:
      - main
jobs:
  publish:
    runs-on: ubuntu-latest
    permissions:
      contents: read
      packages: write 
    steps:
    - uses: actions/checkout@v3

    - name: Set up Node.js
      uses: actions/setup-node@v3
      with:
        node-version: '20.x' 
        registry-url: 'https://npm.pkg.github.com' # GitHub Package Registry URL

    - name: Install dependencies
      run: npm install

    - name: Build
      run: npm run build # replace with your build command

    - name: Publish
      run: npm publish
      env:
        YOUR_ENV_AUTH_TOKEN_TO_WRITE_PACKAGES: ${{secrets.YOUR_ULTRA_SECRET_TOKEN}}
Enter fullscreen mode Exit fullscreen mode

Need help creating the token? - Scroll to the end.

With a push to the main branch, watch the magic unfold: NodeJS setup, dependency installation, package building, and the grand finaleβ€”publishing to GitHub Packages! πŸš€

2. Authenticated Ventures Beyond the Stars πŸ”

To install your private package from another project, a touch of authentication is needed.

a. Craft a Github Token

Head to your GitHub lair, generate a token with read_package privileges, and copy its essence. (Do not forget to authorize the token if you are in an organization clicking the Configure SSO button) πŸ§™β€β™‚οΈ

b. Enchant the .npmrc Incantation

Locate your global .npmrc file (probably in /users/your_user/.npmrc on MacOS) and inscribe a new line:

//npm.pkg.github.com/:_authToken=YOUR_TOKEN

This magical token instructs your local NPM to seek treasures in the npm.pkg.github.com repository, armed with the enchanted authentication. ✨

c. Specify the private NPM repository in your project

Add a new file in the parent folder of your project:Β .npmrc and add Github private registry:

@YourOrgOrProfile:registry=https://npm.pkg.github.com/
Enter fullscreen mode Exit fullscreen mode

Bravo, you've mastered the celestial dance of publishing and installing on GitHub Packages! πŸŽ‰πŸš€

Obtaining Your Magical Githu Token

  1. Navigate to your GitHub account. In the top-right corner, select your profile, and then proceed to Settings.

  2. Scroll down to Developer settings located at the bottom of the page.

  3. Within Developer settings, find the section titled Personal access tokens and enter the sub-section labeled Tokens (classic).

  4. Generate a new token by following the provided steps. Be sure to select read:packages among the permissions.

  5. In case you operate within an organization, exercise caution. After creating the token, click on the Configure SSO button to ensure proper organization authorization.

Top comments (0)