» Tanpa Label » [Go Make Things] How to automatically create a new release and publish to NPM whenever package.json is updated using a GitHub Action

[Go Make Things] How to automatically create a new release and publish to NPM whenever package.json is updated using a GitHub Action

By

​

Wow, that title is a mouthful!

Today, I wanted to share the GitHub Action I built to automatically create a new release for Kelp whenever I update the version number in the package.json file.

Let's dig in!

(Don't want to read all of those. Grab the GitHub Action script here.)

Automate the boring stuff!

Every time I add a new feature to Kelp, my UI library for people who love HTML, I have complete a series of steps…

  1. Update the package.json.
  2. Create a PR.
  3. Wait for tests to pass.
  4. Merge the PR.
  5. Create a new git tag with release details.
  6. Push the new git tag to GitHub.
  7. Run npm publish to deploy the code the CDN.

I know from past experience that I often forget one or more of those last few steps.

I'll forget to create a release note on GitHub, or forget to push to NPM. Then someone opens a GitHub issue asking me to fix it so they can grab the latest version of the code.

It's the perfect set of tasks to automate (I already automate testing when a PR is opened).

My preferred workflow

When code is pushed to main, I want a GitHub action that…

  1. Checks the version in package.json.
  2. Compares it to the current version tag in GitHub.
  3. If they're different…
    • Generates a new GitHub Release summarizing all of the PRs since the last one.
    • Runs npm publish to deploy the latest code to CDN.

That seems like it should be easy, but finding the right combination of tools was annoying difficult!

Common workflows

Most popular libraries I looked at used something like Release Drafter to create a draft release, which they would then manually publish when ready.

By default, Release Drafter looking for version tags on each PR (major, minor, and patch), and automatically creates a release version based on the highest level tag and last release version.

I think this kind of flow caters well to big projects like Bootstrap that will release a bunch of stuff all at once.

For my libraries, I prefer to release lots of small updates frequently. I'm a big fan of shipping small updates early-and-often.

I'm also not great at remembering to tag PRs with version categories, and frankly, I want to manually control that in the package.json file myself anyways.

And most NPM release scripts I found rely on the tag update.

When a new tag is published, it grabs that tag and pushes a new NPM release with that as the version number. In most scripts I found, the package.json file is cut out of the process.

DIY it!

I didn't fork or modify any of these existing tools.

But I did dig deeper into their configurations to get a setup that worked better for me.

  • I found an Action in the GitHub Actions Marketplace that let me grab the version number from package.json.
  • I found an Action to get the current tag version from the GitHub repository.
  • I setup my script to compare the two, and only run if they're not the same.
  • I found the Release Drafter docs on how to manually set the version number and automatically publish the release instead of just drafting it.

Now, any time the package.json changes, the whole "deploy it" process is automated for me.

If you use this script…

There are a few things you need to know.

  1. It uses outputs, which GitHub has deprecated and will stop supporting in the future. They recommend env variables now, so I'll need to update things in the future.
  2. It requires a fine-grained GitHub token named GH_SECRET that requires read/write permission for both content and PRs.
  3. It requires an NPM CLI token named NPM_TOKEN.
  4. You'll want to change the github.repository value to your own. This prevents forks from running the CI script.

Both of those tokens get saved in your repository's "Secrets" section in settings.

You can download the GitHub Action to use yourself here.

If you have any questions about all this, let me know!

Like this? A Go Make Things membership is the best way to support my work and help me create more free content.

Cheers,
Chris

​

Want to share this with others or read it later? View it in a browser.​

​

Share :

Facebook Twitter Google+ Lintasme

Related Post:

0 Komentar untuk "[Go Make Things] How to automatically create a new release and publish to NPM whenever package.json is updated using a GitHub Action"

Back To Top