Context
Given a Yarn Workspace with codebase all written in TypeScript
- lib (e.g. a component library)
- lib2, lib3 … (e.g. lodash utility library)
- app (e.g. a CRA app)
In lib, we have
import lib2 from “lib2” import lib3 from “lib3”
In app, we have
import lib from “lib”
A common dev workflow could be
- work on app
- notice lib needs update
- notice lib2 and lib3 need update
- lib2 and lib3 updated
- lib updated
- back to continue working on app
The Problem
- There are cross dependencies among those workspaces
- The workspaces need to be build in the correct order (i.e. topological order) for app to work properly
Yarn workspace addressed the first problem pretty well but left the second to developers.That's you're likely required to a. run
yarn watch/yarn dev in each workspace b. in a right order.But can we just use a shared build cycle for all workspaces above?? Just like all those libs are part of the app workspace for development.
The Trick
Points the
main/exports field in package.json to src/index.ts for all libs.Caveat
There is clear trade-offs in this approach, this essentially turns monorepo into a single package during local development. But you will still need to figure out how to release/publish those libraries https://yarnpkg.com/features/workspaces#publishing-workspaces, which is a separate problem to solve.