Yarn Workspaces

An abstraction absolutely worth learning, npm has replicated the feature in npm 7.

A yarn workspace is a way to chunk code together in a single repo. The idea evolved from Lerna and I think mostly negates the need to use Lerna from my experience.

Some practical examples of how I use workspaces:

TypeScript Website

• A section of docs is a workspace: handbook docs, tsconfig flags, codegen systems
• Individual npm modules like: @typescript/twoslash, gatsby-remark-twoslash-shiki, etc
• Sections of the TS website which are imported as oldschool <script> tags: playground, sandbox
• The static site generator itself: typescriptlang-org

Capture

• Azure functions
• Admin Dashboard
• KISS Homepage

Puzzlebox

• Games
• Web infra

From there, I give all of the packages a script for "bootstrap", "build" and "test" - they can be NOOPs if it doesn't need it. You can use yarn workspaces run to run those command across all projects in the workspace.

My root package.json then has scripts like:

json
{
  "scripts": {
    "bootstrap": "yarn workspaces run bootstrap && BOOTSTRAPPING=true yarn workspaces run build",
    "build-site": "yarn workspace typescriptlang-org build",
    "build": "yarn workspaces run build",
    "start": "yarn workspace typescriptlang-org start",
    "test": "yarn workspaces run test",
  }
}

For yarn 1, yarn 2 has different syntax.

Deploys

I started writing my own, but now I use pleb - I dislike the name (it's more or less an insult in british English, but isn't everything?)

Pleb does a great job, it checks if the local package version is higher than the version on npm, and if it is then a version isd. Simple and smart.

Long form write-up on different techniques I've used are here