Simplify Package Releases – From Versioning to Publishing

Rate this content
Bookmark

Monorepos have proven to be handy when it comes to developing and publishing related NPM packages. They offer a unified development experience while still enabling the distribution of more fine-grained packages for easy consumption. In fact, many popular OSS libraries follow such an approach such as Vue, Angular, React, Vite, Tanstack and RxJS (just to name a few). However, the publishing process within monorepos introduces unique challenges, particularly when dealing with multiple interdependent packages. And yes, there are solutions out there for versioning and releasing packages, but they often fall short when it comes to monorepos. Nx recently introduced a "release" command tailored for these scenarios.

In my talk, I'll explore how we can setup a publishing process, covering versioning, changelog generation, and releasing to platforms like NPM and GitHub (including provenance support). Join me to discover more.

Juri Strumpflohner
Juri Strumpflohner
7 min
13 Jun, 2024

Comments

Sign in or register to post your comment.

Video Summary and Transcription

The Talk focuses on the Nx release command for publishing npm packages in a monorepo setup. It ensures correct package publishing order, handles versioning and change logs, and allows for simulating changes before publishing. Advanced features include configurable versioning, group releases, and support for different languages. Documentation, videos, and recipes are available for customizing and automating releases on your CI system.

1. Introduction to Nx Release Command

Short description:

I will focus on the Nx release command for publishing npm packages in a monorepo setup. It ensures packages are published in the correct order and handles versioning and change logs. You can run the 'Nx release' command to simulate and see the changes before publishing. Use the 'Nx set up Verdasho' command to create a local Verdasho npm registry for testing.

So, we've got seven minutes. I didn't even prep slides. Now, I could show you how we go from a 10x developer to an Nx developer, but we don't have enough time. My name is Juri. I'm a core team member of Nx. There is a lot of stuff we do from local development to CI, so we have a lot of support.

What I want to focus on is the Nx release command that we pushed out half a year ago roughly to the public, and it's basically about publishing npm packages. I have here a local npm workspace, so if I go to the package JSON, you can see here there is an Nx version installed, there is an npm workspace set up in a package in examples, and if I actually run an Nx graph, which you can run in any workspace even if you don't have Nx installed, it will show you how the structure looks like. It is inspired by 10-sec query which uses Nx to develop their packages. I hope Dominic doesn't watch because there is no logic behind here.

I want to show what it means to version, generate change logs and publish these types of packages. There are solutions out there, but usually, they lack a bit when it comes to a monorepo set-up. You have some dependencies there, especially if we talk about versioning, but even in the publishing process, if we push out these packages to npm, we don't want to push out a package that we want to push out in the right order because we don't want to have a package end up there, your network goes down in the middle, and you end up with a dependency that is not outpublished yet. How does it work? Basically, you can run a single command which is an Nx release. This is our first release because we don't have one yet. Then you run minus D which is a simulation mode. I want to do a dry run to see what happens. It goes through the package that you have. Yes, we want to release a major version. As you can see, it prints out a diff of what would happen, so it increments the version accordingly. It also updates local dependencies that you might have in that workspace, and it generates a change log if it needs to be generated. Basically, I can go and drop that minus D. Run again the major version, and go ahead and create that. The first step down here, it asks for publishing. I don't want to push that out on npm, but what we can do here is I have set up a local Verdasho npm registry. You can do that. We have a generator that helps you set that up. If you run Nx set up Verdasho, it would create that for you, and now we can run something like local registry. Typing with this inclination is pretty interesting. This would be our local Verdasho.

2. Advanced Features of Nx Release

Short description:

In the real-world scenario, you can configure versioning, including independent versioning and GitHub releases. Nx release supports group releases and can be extended to different languages. Documentation is available with managed releases, walk-through videos, and recipes for customizing and automating releases on your CI system.

I removed that immediately, so it's pretty bright. This runs now and rewrites all my local publishing, so I can hit through and it would then deploy this to this local Verdasho instance. In fact, if I go back, you can see the actual packages pop up there.

In the real-world scenario, you don't want to go and every time manually specify what version you want to increment, whether it's a major or not, so there's the possibility in the NxJSON here to configure some of that. Now, if you run NxRelease again, just run it through, it automatically detects this is a minor update we make, so the version you want to get is 1.1.0, and we can say we want to publish this, and we also get here now a change lock at the root that is in this representation. Now, there are some more options that you can configure there. You can define what is the actual product relation in here, so is it like something that you want to fix versioning so all the packages are incremented at the same time, you want to have independent versioning, and also things like you want to have GitHub releases at the same time being pushed rather than just npm. You can do more stuff in the sense of having group releases which is pretty interesting, so in the sense that, in this case, for instance, we have, if you look, more React-related parts, we have a solid in here, and more core parts, so you could even go ahead and say you want to have some sort of release groups.

These are some of the features that we implemented in that Nx release version. It is right now one of the packs that we support is like JavaScript, but you can extend it on your own. The general versioning and publishing process. We even have one for Rust, and it can be extended to other languages as well. There's a lot of the features and stuff that I showed you today is like on our docs, so there's like a managed releases in general which has a walk-through video, and as well down here, you see a bunch of different recipes for customising and automating releases on your CI system, how to do NPM provenance support, and those types of things you would want to have in an open-source packaging publishing way. All right, that's it. That's all I can show you so far. We're still outside of the booth, so if you want to check that out and come by and dive a bit deeper, happy to answer questions. Thank you.

Check out more articles and videos

We constantly think of articles and videos that might spark Git people interest / skill us up or help building a stellar career

Levelling up Monorepos with npm Workspaces
DevOps.js Conf 2022DevOps.js Conf 2022
33 min
Levelling up Monorepos with npm Workspaces
Top Content
Learn more about how to leverage the default features of npm workspaces to help you manage your monorepo project while also checking out some of the new npm cli features.
End the Pain: Rethinking CI for Large Monorepos
DevOps.js Conf 2024DevOps.js Conf 2024
25 min
End the Pain: Rethinking CI for Large Monorepos
Scaling large codebases, especially monorepos, can be a nightmare on Continuous Integration (CI) systems. The current landscape of CI tools leans towards being machine-oriented, low-level, and demanding in terms of maintenance. What's worse, they're often disassociated from the developer's actual needs and workflow.Why is CI a stumbling block? Because current CI systems are jacks-of-all-trades, with no specific understanding of your codebase. They can't take advantage of the context they operate in to offer optimizations.In this talk, we'll explore the future of CI, designed specifically for large codebases and monorepos. Imagine a CI system that understands the structure of your workspace, dynamically parallelizes tasks across machines using historical data, and does all of this with a minimal, high-level configuration. Let's rethink CI, making it smarter, more efficient, and aligned with developer needs.
Federated Microfrontends at Scale
React Summit 2023React Summit 2023
31 min
Federated Microfrontends at Scale
Top Content
The talk will be a story of how Personio went from rendering through a Monolithical PHP architecture, to a microfrontend oriented Next JS app, powered by Module Federation and the NX monorepo toolchain.
Scale Your React App without Micro-frontends
React Summit 2022React Summit 2022
21 min
Scale Your React App without Micro-frontends
As your team grows and becomes multiple teams, the size of your codebase follows. You get to 100k lines of code and your build time dangerously approaches the 10min mark 😱 But that’s not all, your static CI checks (linting, type coverage, dead code) and tests are also taking longer and longer...How do you keep your teams moving fast and shipping features to users regularly if your PRs take forever to be tested and deployed?After exploring a few options we decided to go down the Nx route. Let’s look at how to migrate a large codebase to Nx and take advantage of its incremental builds!
The Age of Monorepos
JSNation 2022JSNation 2022
25 min
The Age of Monorepos
The history of the web can be divided into evolutionary development leaps. The age of inline scripts, the age of jQuery, the age of SPAs, the age of JAMStack...We are now entering the next stage that has been carefully prepared in the past few years. Let me invite you to the world of modern monorepo solutions and share with you the benefits you will reap by using them in every project size and setup. It's time you automate those boilerplate tasks and reduce the bottlenecks so you can focus on what truly matters.Get ready for the next leap! Welcome to the age of monorepos!
Remixing Your Stack in a Monorepo Workspace
Remix Conf Europe 2022Remix Conf Europe 2022
22 min
Remixing Your Stack in a Monorepo Workspace
Remix entered the stage with a unique and refreshing take on how to develop on the web. But how do you integrate it into your existing ecosystem of applications? Do you want to test-drive Remix on a small project, or do you want to go full-in, but it is tricky to do a big-bang migration from your existing React app? In this talk, we're going to explore how a monorepo-based code organization can help integrate Remix with your existing React and TypeScript infrastructure, facilitating high code reuse and a migration path to Remix.

Workshops on related topic

React at Scale with Nx
React Summit 2023React Summit 2023
145 min
React at Scale with Nx
Top Content
Featured WorkshopFree
Isaac Mann
Isaac Mann
We're going to be using Nx and some its plugins to accelerate the development of this app.
Some of the things you'll learn:- Generating a pristine Nx workspace- Generating frontend React apps and backend APIs inside your workspace, with pre-configured proxies- Creating shared libs for re-using code- Generating new routed components with all the routes pre-configured by Nx and ready to go- How to organize code in a monorepo- Easily move libs around your folder structure- Creating Storybook stories and e2e Cypress tests for your components
Table of contents: - Lab 1 - Generate an empty workspace- Lab 2 - Generate a React app- Lab 3 - Executors- Lab 3.1 - Migrations- Lab 4 - Generate a component lib- Lab 5 - Generate a utility lib- Lab 6 - Generate a route lib- Lab 7 - Add an Express API- Lab 8 - Displaying a full game in the routed game-detail component- Lab 9 - Generate a type lib that the API and frontend can share- Lab 10 - Generate Storybook stories for the shared ui component- Lab 11 - E2E test the shared component
Node Monorepos with Nx
Node Congress 2023Node Congress 2023
160 min
Node Monorepos with Nx
Top Content
WorkshopFree
Isaac Mann
Isaac Mann
Multiple apis and multiple teams all in the same repository can cause a lot of headaches, but Nx has you covered. Learn to share code, maintain configuration files and coordinate changes in a monorepo that can scale as large as your organisation does. Nx allows you to bring structure to a repository with hundreds of contributors and eliminates the CI slowdowns that typically occur as the codebase grows.
Table of contents:- Lab 1 - Generate an empty workspace- Lab 2 - Generate a node api- Lab 3 - Executors- Lab 4 - Migrations- Lab 5 - Generate an auth library- Lab 6 - Generate a database library- Lab 7 - Add a node cli- Lab 8 - Module boundaries- Lab 9 - Plugins and Generators - Intro- Lab 10 - Plugins and Generators - Modifying files- Lab 11 - Setting up CI- Lab 12 - Distributed caching