Automatically Start Scripts On Launch In VSCode

5t3ph

Stephanie Eckles

Posted on February 26, 2021

Automatically Start Scripts On Launch In VSCode

VSCode comes with the ability to create tasks that operate off of a variety of things. One option is to run one of your package scripts upon opening your project in VSCode.

For myself, I create a lot of sites with Eleventy so my npm start command runs Eleventy in --serve mode which means it includes creating a local server with Browsersync. Opening any of my Eleventy projects quite likely means I want to make edits and have that server running. So let's learn how to launch it automatically!

Create A Task

To add the launch task, add the directory .vscode to the root of your project if it doesn't already exist.

Then, create the file tasks.json. This is the required name to enable detection by VSCode.

Add the following as the content of that file:



{
  // See https://go.microsoft.com/fwlink/?LinkId=733558
  // for the documentation about the tasks.json format
  "version": "2.0.0",
  "tasks": [
    {
      "type": "npm",
      "script": "start",
      "label": "Launch Site",
      "group": "none",
      "presentation": {
        "reveal": "always",
        "panel": "new"
      },
      "runOptions": {
        "runOn": "folderOpen"
      }
    }
  ]
}


Enter fullscreen mode Exit fullscreen mode

Configure the following if needed:

  • script - update to the name of your script if it's not start
  • label - this can be whatever you want!

Leave the other options as-is. The runOptions enables running the command on start (folderOpen), and the presentation set of options means that a new Terminal will be opened to reveal the task running.

Allow The Task To Run

There's one more step before this will work which is to manually run it once and allow permission for the auto run behavior.

To do this, use the VSCode menu for Terminal and select Run Task, then select "Launch Site" (or your custom name if you updated it). You will be prompted to make a selection on the type of scan (if unsure, choose the top option).

The task will then run. When the launch task completes, end it with Ctrl + C.

You will receive one final popup message asking for your permission to run the task on open of the folder. Select "Allow and run".

The previously described popup including the action of Allow and run

Now, completely close and restart VSCode and your task should now run right after it opens!

💖 💪 🙅 🚩
5t3ph
Stephanie Eckles

Posted on February 26, 2021

Join Our Newsletter. No Spam, Only the good stuff.

Sign up to receive the latest update from our blog.

Related

Automatically Start Scripts On Launch In VSCode
todayilearned Automatically Start Scripts On Launch In VSCode

February 26, 2021