DEV Community 👩‍💻👨‍💻

Discussion on: Exploring the Monorepo #2: Workspaces (npm, pnpm)

Collapse
ruyadorno profile image
Ruy Adorno

hi @jonlauridsen , did you looked up docs.npmjs.com/cli/v7/using-npm/wo... ? Was that the page that you found to be really terse?

From the community side, I've seen some nice tutorials that you might find useful in order to give npm workspaces a try:

Collapse
jonlauridsen profile image
Jon Lauridsen Author • Edited on

Hi Ruy,

Yes that's the documentation I read. Maybe terse is the wrong word, but I followed it to set up my project but didn't get much working, and I didn't find a way to read my way to clarity. It was a couple different things, like commands were failing until I upgraded npm because what came with my npm 16.1 wasn't workspace-aware (despite being 7.x, but I think I was running install --workspaces which didn't land until 7.14 (?), but none of that is in the docs so it was quite an initial confusion).

Anyway, then, with npm 7.19.0 installed, I got into some weird state when I did this:

$ cd apps/web
$ npm install
$ npm start
[tsc] ../../libs/types/src/index.ts(1,23): error TS2307: Cannot find module 'type-fest' or its corresponding type declarations.
Enter fullscreen mode Exit fullscreen mode

I think in this case workspaces get totally ignored, and it installed "types" from the registry, which is so very far from what I wanted.

But installing from the root folder also fails:

$ npm install
$ cd apps/web
$ npm start
[tsc] src/pages/Home.tsx(3,29): error TS2307: Cannot find module 'types' or its corresponding type declarations.
Enter fullscreen mode Exit fullscreen mode

I'm probably doing something silly and the tool itself works fine, but I didn't get enough feedback from the docs and npm to make progress, and it took a long time to install the dependencies, so I gave up. Happy to try again though, I have an in-progress branch at github.com/gaggle/exploring-the-mo... that I'm happy to give another go on if you or someone else sees what I do wrong.

And thanks for the links, I do remember reading them both when they came out but I didn't come across them in my attempts this time around.

Collapse
ruyadorno profile image
Ruy Adorno

I see! thanks a lot for the feedback! 😄

It seems to me you were hitting one of the biggest DX hiccups (IMO) we're still yet to solve, which is the fact that in order to work with workspaces you can NOT cd into that folder (e.g: cd apps/web) - instead what you want to do is to run the command from the project root level and set a workspace config value, like: npm start -w ./apps/web

It's the same for adding new dependencies to a workspace, let's say you want to add a new dependency named path-complete-extname to a child workspace at ./apps/web, then the syntax to do so is to run from the root: npm install path-complete-extname -w ./apps/web (notice you can also just use the "name" value of a child workspace, so if the name property of ./apps/web/package.json is web then you can simply run: npm install path-complete-extname -w web

Again, thanks for the feedback! This type of real life UX report helps us a lot!