NPM-WORKSPACES(7)

πŸ“¦
version 12.2.1 Β· 2 versions
, in arch rolling

πŸ¦‹ NPM-WORKSPACES(7) β€” the workspaces glow-up πŸ¦‹

okay so welcome to npm-workspaces, bestie πŸ’… this is the page for Workspaces β€” Working with workspaces, and no cap it's gonna make your monorepo life so much easier.

✨ Description ✨

So "Workspaces" is a generic term β€” it's the whole lil family of features in the npm cli that lets you manage, like, multiple packages from your local file system, all from inside one singular top-level, root package. main character energy fr fr πŸ‘‘

This feature set is literally what makes handling linked packages from your local file system so much more streamlined. It automates the linking process as part of npm install and removes the need to manually use npm link to add references to packages that should be symlinked into the current node_modules folder. not me being emotional about not having to hand-link anything ever again 😭

We also refer to these packages being auto-symlinked during npm install as a single workspace β€” meaning it's a nested package within the current local file system that is explicitly defined in the package.json ⟨/configuring-npm/package-json#workspaces⟩ workspaces configuration. iykyk 🫢

πŸŽ€ Defining workspaces πŸŽ€

Workspaces are usually defined via the workspaces property of the package.json ⟨/configuring-npm/package-json#workspaces⟩ file, e.g:

{
  "name": "my-workspaces-powered-project",
  "workspaces": [
    "packages/a"
  ]
}

Given the above package.json example living at a current working directory . that contains a folder named packages/a that itself contains a package.json inside it, defining a Node.js package, e.g:

+-- package.json
`-- packages
   +-- a
   |   `-- package.json

The expected result once running npm install in this current working directory . is that the folder packages/a will get symlinked to the node_modules folder of the current working dir. slay πŸ’–

Below is a post npm install example, given that same previous example structure of files and folders:

+-- node_modules
|  `-- a -> ../packages/a
+-- package-lock.json
+-- package.json
`-- packages
   +-- a
   |   `-- package.json

see that lil arrow? that's the whole vibe 🌸

🌈 Getting started with workspaces 🌈

You may automate the required steps to define a new workspace using npm help init. For example in a project that already has a package.json defined you can run:

npm init -w ./packages/a

This command will create the missing folders and a new package.json file (if needed) while also making sure to properly configure the "workspaces" property of your root project package.json. it does the annoying part for you, we stan ⭐

πŸ’œ Adding dependencies to a workspace πŸ’œ

It's possible to directly add/remove/update dependencies of your workspaces using the workspace config ⟨/using-npm/config#workspace⟩.

For example, assuming the following structure:

+-- package.json
`-- packages
   +-- a
   |   `-- package.json
   `-- b
       `-- package.json

If you want to add a dependency named abbrev from the registry as a dependency of your workspace a, you may use the workspace config to tell the npm installer that package should be added as a dependency of the provided workspace:

npm install abbrev -w a

🧚 Adding a workspace as a dependency of another workspace 🧚

The same approach works when adding one workspace as a dependency of another. If you want to add workspace b as a dependency of workspace a, run:

npm install b -w a

npm will detect that b is a workspace and automatically symlink it rather than fetching it from the registry. The resulting entry in workspace a's package.json will use a standard version range:

{
  "dependencies": {
    "b": "^1.0.0"
  }
}
Note: other installing commands such as uninstall, ci, etc will also respect the provided workspace configuration. πŸ’€ yes even those. they all behave.

πŸ¦‹ Using workspaces πŸ¦‹

Given the specifics of how Node.js handles module resolution ⟨https://nodejs.org/dist/latest-v14.x/docs/api/modules.html#modules_all_together⟩ it's possible to consume any defined workspace by its declared package.json name. Continuing from the example defined above, let's also create a Node.js script that will require the workspace a example module, e.g:

// ./packages/a/index.js
module.exports = 'a'

// ./lib/index.js
const moduleA = require('a')
console.log(moduleA) // -> a

When running it with:

node lib/index.js

This demonstrates how the nature of node_modules resolution allows for workspaces to enable a portable workflow for requiring each workspace in such a way that is also easy to npm help publish these nested workspaces to be consumed elsewhere. it's giving portable and iconic ✨

πŸ‘‘ Running commands in the context of workspaces πŸ‘‘

You can use the workspace configuration option to run commands in the context of a configured workspace. Additionally, if your current directory is in a workspace, the workspace configuration is implicitly set, and prefix is set to the root workspace. sneaky-but-helpful behavior, we love 🫢

Following is a quick example on how to use the npm run command in the context of nested workspaces. For a project containing multiple workspaces, e.g:

+-- package.json
`-- packages
   +-- a
   |   `-- package.json
   `-- b
       `-- package.json

By running a command using the workspace option, it's possible to run the given command in the context of that specific workspace. e.g:

npm run test --workspace=a

You could also run the command within the workspace.

cd packages/a && npm run test

Either will run the test script defined within the ./packages/a/package.json file. same energy, two routes, both valid πŸ’…

Please note that you can also specify this argument multiple times in the command-line in order to target multiple workspaces, e.g:

npm run test --workspace=a --workspace=b

Or run the command for each workspace within the 'packages' folder:

npm run test --workspace=packages

It's also possible to use the workspaces (plural) configuration option to enable the same behavior but running that command in the context of all configured workspaces. e.g:

npm run test --workspaces

Will run the test script in both ./packages/a and ./packages/b. πŸ”₯

Commands will be run in each workspace in the order they appear in your package.json

{
  "workspaces": [ "packages/a", "packages/b" ]
}

Order of run is different with:

{
  "workspaces": [ "packages/b", "packages/a" ]
}

so yeah, array order is the actual order. no surprises, just vibes 🌸

πŸ“ Ignoring missing scripts πŸ“

It is not required for all of the workspaces to implement scripts run with the npm run command.

By running the command with the --if-present flag, npm will ignore workspaces missing target script.

npm run test --workspaces --if-present

no more "missing script" meltdowns, we're chill now 😌

🌟 See also 🌟

  • npm help install
  • npm help publish
  • npm help run
  • npm help config

and that's the whole page, bestie πŸ’– one last thing β€” this lil masterpiece is from NPM@12.2.1, so when you're out there symlinking everything and running --workspaces like a boss, just know the manual said so. go forth and monorepo, queen πŸ‘‘πŸ’…βœ¨

πŸ“¦ where this page comes from