VSCode Task to run various node commands

Question

I have a monorepo where I wish to create a script for starting up a specific project locally.

The project is completely Node.js based.

For me to set up this project locally for development, I need to run the following commands in this order:

1. Start up the docker images

   • cd docker/dockerForTests
     
   • docker-compose up -d

2. Start up the Web Auth server

   • cd src/project/webAuthentication
     
   • setenvs projectAuthentication && npm start

3. Start up the API

   • cd src/project/api
   • setenvs projectAPI && npm start

4. Start up the web client

   • cd src/project/web
   • setenvs projectWeb && npm start

I usually start each section up in a new terminal window, within VSCode, for ease of use.

To automate this process, I found out about VSCode Tasks.

Although it appears they are designed for 'building' or 'watching' tasks, I thought that I could modify the behavior to run the above commands for me.

Here was my attempt:

{
    // See https://go.microsoft.com/fwlink/?LinkId=733558
    // for the documentation about the tasks.json format
    "runner": "terminal",
    "version": "2.0.0",
    "tasks": [
        {
            "label": "Start Docker",
            "dependsOrder": "sequence",
            "type": "shell",
            "command": "cd docker/dockerForTests && docker-compose up -d",
        },
        {
            "label": "Start Web Auth",
            "dependsOrder": "sequence",
            "type": "process",
            "command": "cd src/project/webAuthentication && setenvs projectAuthentiction && npm start"
        },
        {
            "label": "Start Up Local Development Environment",
            "presentation": {
                "echo": true,
                "reveal": "always",
                "focus": true,
                "panel": "new",
                "showReuseMessage": false,
                "clear": true
            },
            "dependsOn": [
                "Start Docker",
                "Start Web Auth"
            ],
            "problemMatcher": []
        }
    ]
}

The first command works fine, but I wanted it to be like the integrated terminal, where it hangs for input once the command has finished running.

Secondly, the second task does not work as it's not a Node command.

I would like it to work like the regular, bash input.

How can I automate my above workflow? Is it even possible?

Answer 1

At least for points 2, 3 and 4 concurrently works fine, and it should work fine for point 1 as well. With following scripts in scripts section of package.json in your root directory you should be able to launch your dev env with just one command

"start-docker": "cd docker/dockerForTests && docker-compose up -d",
"start-auth": "cd src/project/webAuthentication && setenvs projectAuthentication && npm start",
"start-api": "cd src/project/api && setenvs projectAPI && npm start",
"start-client": "cd src/project/web && setenvs projectWeb && npm start",
"start-dev": "concurrently \"npm run start-docker\" \"npm run start-auth\" \"npm run start-api\" \"npm run start-client\""

This doesn't use VSCode task, but would simplify your life anyway.

Answer 2

You should be able to add the necessary scripts to the root package.json's scripts section. Once you do that, you should see them as VS Code tasks, thanks to VS Code's automatic task detection.

See https://code.visualstudio.com/docs/editor/tasks#_task-autodetection for details.