Run Dev Scripts for All Packages Simultaniously

Share this video with your friends

Send Tweet
Published 2 years ago
Updated 2 years ago

Right now, it is not possible to run all the Dev Scripts across all the packages of the monorepo at the same time, because once we run npm run dev with the -ws flag, we will run the dev-command in the block first, but that command never ends. It is always watching for changes.

In order to run the dev scripts across all the packages in the monorepo, the first thing that we have to do, is to create a dev command for each one of the packages in the root package.json file. Then we can use concurrently to change them. We go concurrently and we tell it to run the utils, then the blog and then the dashboard scripts.

[0:00] Instructor: Right now, it is not possible to run all the Dev Scripts across all the packages of the monorepo at the same time, because once we run npm run dev with the WS flag, we will run the dev-command in the block first, but that command never ends. It is always watching for changes.

[0:21] Then if I stop that command by hitting Ctrl C, we will see that we are running the vid-server as well. Then if I stop it again, we'll see that we exit. To fix this, we are going to install a package called concurrently. Let's run npm install concurrently.

[0:41] Concurrently is going to be installed in the root package.json of the monorepo. It's also going to be the dependency. Let's add a couple of scripts. We're going to create one script to run the Utils project. What this script is going to do, is that it's going to run npm run dev.

[1:01] For the workspace, monorepo/utils. We are going to duplicate that two times because we have two projects. Let's replace utils with blog. Let's replace it with dashboard. Now that we have all these three commands, we are going to create the dev script.

[1:26] This script is going to run concurrently. We have to skip double quotes here. Let's do that. We are going to take concurrently to run the npm script that is called dev details. We're going to do the same for the other two commands that we have left.

[1:49] This one is now details. This one is blog, and this one is going to be dashboard. We can run the dev script that we just created, and you'll see that we are running the dev command in the utils package. We are also running the dev command in the blog package, and we are running the dev command in the dashboard package.

[2:15] To recap, in order to run the dev scripts across all the packages in the monorepo, the first thing that we have to do, is to create a dev command for each one of the packages in the root package.json file. Then we can use concurrently to change them. We go concurrently and we tell it to run the utils, then the blog and then the dashboard scripts.

Pavel Klochkov
Pavel Klochkov
~ 2 years ago

Hey. You can simplify and make universal the dev script. "dev": "concurrently "npm run dev:*"".

~ 10 months ago

more simplify is: "dev": "concurrently npm:dev:*"