Install Turborepo in an Existing Monorepo

Share this video with your friends

Social Share Links

Send Tweet
Published 2 years ago
Updated a year ago

At the root of our project, we'll run npm install turbo --save-dev to install Turborepo.

We'll also look at how to configure Turborepo in the turbo.json file. We'll look into the $schema and how it affects our configuration.

Instructor: [0:00] Let's begin by installing Turborepo in the root of the project as a devDependency. [0:07] Now that Turborepo's installed, we can create a turbo.json file. All the configuration that we want to add to Turborepo is going to be in this file. Let's begin by adding the schema key. The value for that key is going to be this JSON Schema URL, so let's check this out.

[0:33] As you can see, this is a JSON Schema file and it has some definitions. For instance, it has definitions for pipeline, remote cache, and schema. Let's open remote cache.

[0:45] As you can see here, we have this signature. It defaults to false. It has a really nice description and is of type Boolean. What that gives us is autocomplete here. For instance, if I type double quotes then Ctrl-Space, that's OpenRemote cache. Then let's do it again, signature, and it says .

[1:09] Basically, the JSON schema that we are using here is a blueprint for all the things inside turbo.json. Now let's delete this remote cache because we don't need it. The last thing that we are going to do is that we are going to add the .turbo folder. This .turbo folder is going to be used for turborepo to add logs and to save certain outputs.

[1:43] We also need to ignore the outputs that are produced in our applications and our libraries. For instance, because we are using VJS and we are using TS app, we are ignoring the dist folder. We have another application that is a NextJS application, so we are ignoring the .next folder.

[2:08] To recap, we added turbo as a dev dependency in the root package json file. We also created a turbo.json file which is the one that is going to hold all the information about turbo in our project.

[2:22] We also ignored the .turbo folder in the root Git ignore, and we also make sure that we are ignoring the dist folder and the .next folder. Those are where NextJS outputs its artifacts. Same goes for dist...

~ 9 months ago

Considering that both the nextjs and react apps come with their own .gitignore files, what are your thoughts on multiple .gitignore files? I've seen some say it's bad but I think we have two options since this is a monorepo. 1. let each app handle it's own, 2. merge everything into one file at the root. In the 1st approach I had to add a .gitignore to the utils workspace just to ignore the dist folder. So dist is ignored 3 times (once for each workspace) which has me kinda thinking about merging. But what if I merge and then forget that next has a .next folder? In that case it could be good to let each app/workspace handle it's own. So I'm undecided.

On a related note, create-next-app initialized it's own git repo so I had to delete the .git folder so I wouldn't have a repo inside a repo. But I was wondering is there a use case for having a repo in a repo?


Markdown supported.
Become a member to join the discussionEnroll Today