DEV Community

Aurore T
Aurore T

Posted on • Updated on

Publish your npm packages automatically with Auto and Github Action

If you have your own npm package you make updates to regularly and use in multiple projects, publishing can take time and testing new release can be annoying.

Auto is a tool that allows you to streamline your release process, using labels on your Pull request to know what version to publish, following semantic versioning. Oh, and the cherry on the cake, it generates release notes and CHANGELOG automatically too!

My team has been using for months now, and we love it! Getting a newly published version just from merging a Pull Request saved so much time.

What does Auto does?

We use auto command shipit to handle multiple scenarios automatically:

  • If it's called from the base branch or main branch (like master) ⇒ A new version of the package is released:

This is the basic feature which will get you a new npm package version.

  • If it's called from a Pull Request in CI ⇒ a canary version is released: A canary release is like a preview of your package once it's published, like a temporary package version. This is very handy to test your work on a project using your repo and have that repo pass it's own CI requirements or provide testing links to testers.
  • If called from a pre-release branch (like next) ⇒ A pre-release version will be released:

This is great to create a beta version of your next big update and test them on projects which are using your package.

There are more features you check out on their documentation, but this covers most cases you will need.

Setup

Auto has good documentation available here on how to get you started.

Here is what I had to do to be able to run it via GitHub Actions:

  • Run npm install --save-dev auto
  • Create .autorc to add the user info to use with git
{
  "author": {
    "name": "FirtName LastName",
    "email": "youremail@gmail.com"
  }
}
Enter fullscreen mode Exit fullscreen mode

There is a lot more you can configure via .autorc, have a look at the doc here.

  • Create tokens

To run auto, you need an npm token and a GitHub token. GitHub action provides a token automatically via secrets.GITHUB_TOKEN. You will need to create an npm token with read and publish access level and saved it in your repo secrets as NPM_TOKEN.

  • Create labels

The main thing you will need to do is to create the labels on your repo via the auto command. You will need to this from your project locally.

  1. Follow these instructions to create a GitHub token. You will need to give it repo permissions.
  2. Once you have your token, run GH_TOKEN={YOUR_TOKEN} auto create-labels from the root of your project.
  3. Once done, you can delete the GitHub token if you have no use for it.

GitHub Action setup

Create a new workflow file .github/workflows/auto-publish.yml

name: Auto publish and create release
on:
  push:
    branches:
      - master
            - next
  pull_request:
    branches:
      - master
jobs:
  autorelease:
    runs-on: ubuntu-latest
    if: "!contains(github.event.head_commit.message, 'ci skip') && !contains(github.event.head_commit.message, 'skip ci')"
    steps:
      - name: Checkout
        uses: actions/checkout@v2
      - run: git fetch --unshallow --tags
      - name: Setup node
        uses: actions/setup-node@v1
        with:
          node-version: '12.x'
          registry-url: 'https://registry.npmjs.org'
      - name: Auto release
        env:
          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
          NPM_TOKEN: ${{ secrets.NPM_TOKEN }}
          NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}
        run: |
          npm ci
          npx auto shipit
Enter fullscreen mode Exit fullscreen mode

Note:

  • Creating new releases on merging pull request to master
  • Creating pre releases on merging pull request to next
on:
  push:
    branches:
      - master
            - next
Enter fullscreen mode Exit fullscreen mode
  • Create canary release when a PR is created against master
on:
 pull_request:
    branches:
      - master
Enter fullscreen mode Exit fullscreen mode
  • Do not run auto when it makes changes to CHANGELOG to not get stuck in a release loop.
if: "!contains(github.event.head_commit.message, 'ci skip') && !contains(github.event.head_commit.message, 'skip ci')"
Enter fullscreen mode Exit fullscreen mode
  • Handle installing private package if you have any
 - name: Setup node
        uses: actions/setup-node@v1
        with:
          node-version: '12.x'
          registry-url: 'https://registry.npmjs.org'
Enter fullscreen mode Exit fullscreen mode

and

NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}
Enter fullscreen mode Exit fullscreen mode

Enjoy your new release process 🚀

PS: The documentation also have an example for GitHub action: https://intuit.github.io/auto/docs/build-platforms/github-actions

Top comments (0)