Boost Node.js and Bun Project Management with PNPM | Essential Workspace & Catalog Tips

A Few Tips for Managing Node and Bun Projects with PNPM

In today’s development ecosystem, Node.js and Bun have become popular choices—especially for building efficient JavaScript applications. PNPM, as a high-performance package manager, helps developers manage these projects more effectively. Here are a few useful tips for managing Node.js and Bun projects with PNPM.

Quick Installation and Updates

PNPM manages dependencies in a unique way by using symbolic links to minimize duplicate installations. This approach not only saves disk space but also improves installation speed. To install new packages, use:

pnpm add <package-name-a> <package-name-b>

To update existing packages, run:

pnpm up <package-name-a> <package-name-b> --latest

This ensures your project always uses the latest versions of dependencies.

pnpm up <package-name-a> --filter <app-name-a>

Managing Multiple Projects with Workspaces

For large or multi-project repositories (monorepos), the Workspace feature in PNPM is incredibly useful. With it, you can manage multiple packages within the same repository and share dependencies between them seamlessly.

To get started, create a pnpm-workspace.yaml file in the root directory and define your subprojects:

packages:
  - 'apps/*'
  - 'packages/*'

This setup allows you to organize and manage multiple subprojects under the packages and apps directories.

Managing Workspace Versions with Catalogs

The catalog feature allows you to define reusable constants for dependency version ranges across your workspace.

You can define a catalog in your pnpm-workspace.yaml file like this:

catalog:
  "@tanstack/react-query": ^5.51.24
  "@trpc/client": ^11.0.0-rc.482
  "@trpc/react-query": ^11.0.0-rc.482
  "@trpc/server": ^11.0.0-rc.482
  "@trpc/next": ^11.0.0-rc.482
  eslint: ^9.9.0
  typescript: ^5.5.4

Then, in the package.json of each workspace where you want to reference these dependencies, specify:

{
  "name": "@acme/app",
  "dependencies": {
    "@tanstack/react-query": "catalog:",
    "@trpc/client": "catalog:"
  }
}

You can also define multiple catalogs with aliases to handle different dependency versions:

catalogs:
  # Referenced as "catalog:react18"
  react18:
    react: ^18
    react-dom: ^18

  # Referenced as "catalog:react19"
  react19:
    react: ^19
    react-dom: ^19

Customizing Package Names with Aliases

Sometimes, you might need to install multiple versions of the same package within a single project. You can achieve this with aliases.

For example, suppose your project uses @mui/x-date-pickers, and you need to introduce the latest version of some components without breaking backward compatibility. You can define aliases like so:

{
  "name": "@acme/app",
  "dependencies": {
    "@mui/x-date-pickers": "^7.6.2",
    "@mui/x-date-pickers-legacy": "npm:@mui/[email protected]"
  }
}

Then, adjust your imports accordingly:

import { DateTimePicker } from "@mui/x-date-pickers-legacy/DateTimePicker";

import { DesktopDateTimePicker } from "@mui/x-date-pickers/DesktopDateTimePicker";

Boosting Development Efficiency with Bun Integration

Bun is a new JavaScript runtime that can be paired with PNPM to improve development speed even further. You can use PNPM to manage Bun dependencies and take advantage of Bun’s fast startup and execution performance to speed up your workflow.

To get started, simply install Bun and add any required dependencies. Whether you’re using Node.js or Bun, PNPM ensures a consistent and efficient package management experience.

Conclusion

Using PNPM to manage Node.js and Bun projects can significantly improve your development efficiency. With the tips above, you can install and update packages more easily, manage multiple projects within workspaces, and integrate modern tools seamlessly. Hopefully, these insights help you achieve better results in your projects!