Create a pnpm Workspace

Juri Strumpflohner: [0:00] I have here an empty folder with a .gitignore, which have some common ignores. I also have a package.json, which is a very simple one. This is the package.json for our root-level tooling that we will need in our monorepo set up. [0:15] Before we go ahead, we should define how we want to structure our monorepo workspace. There's basically two different approach. There's the app-centric one and there's the packages-centric one.

[0:25] The app-centric one is usually characterized by having an apps folder in there of some sort and having a libs folder, which is also called often packages folder. These are very good for developing applications, as the name already tells us. Usually, what you have is you have your deployables, your apps in here.

[0:44] They're very thin usually because most of the time, what they do is reference stuff from the libs and packages folder. Some of the packages in those two folders could be published to some npm repository, but they usually are not. Usually, they are just being used from those apps folders up here.

[1:00] Then there's the package-centric approach. The package-centric approach is the typical one that things like Vue.js, ReactJS, Angular use. Many other modern frameworks, they all use the package-centric approach. All you have there is usually a packages folder. Sometimes, it is also called a little bit different.

[1:19] The whole reason for having that is simply to have one single location that groups all the various packages. There might be relations among those, but the main goal is to publish those packages separately on to npm or some other type of registry so that you can then consume it from some other libraries that are outside of the monorepo.

[1:38] That's the main distinction here between the two. I would want to focus mostly on the upper one, also because once you understand this one, publishing your packages and having a more package-centric approach is very easy to achieve.

[1:52] The first step is to set up those folders. What we are going to do is create an apps folder and a packages folder. That, to some degree, already defines our monorepo workspace set up, a monorepo workspace structure.

[2:04] Specifically, if you want to use pnpm, we also need to tell pnpm that this is not just a normal setup, but this is actually a pnpm workspace, which is the approach that you use for creating monorepos.

[2:16] To do that, we create a pnpm-workspace.yaml file at the very root of our workspace. Then, we need to configure that one. All we need to do here is to tell pnpm what the structure of our monorepo workspace looks like. This is a packages entry that you need to specify.

[2:36] Then basically, you give it a structure, which is in our case 'apps' for hosting our applications and 'packages' for hosting our packages.

[2:45] Obviously, in the package-centric approach, you will have a single entry. What we also want to have here is specify some gloves, so we would want to include all the things that are inside those folders. With that, we have set up our pnpm workspace.