Is it possible to have VS code run several commands and start an app (or several) upon opening a project?
The ideal case for what I am doing would be:
The goal being to open the project in VS code and just get to work instead of running through several setup steps.
To run or debug a simple app in VS Code, select Run and Debug on the Debug start view or press F5 and VS Code will try to run your currently active file. However, for most debugging scenarios, creating a launch configuration file is beneficial because it allows you to configure and save debugging setup details.
Start VS Code. Select “File > Open Folder” (or “File > Open” in macOS) from VS Code's main menu. In the selection dialog, create a new folder, rename it accordingly, then click “Select Folder” (“Open” on macOS). Open VS Code's terminal (command prompt) by selecting “View,” then click on “Terminal.”
A launch. json file is used to configure the debugger in Visual Studio Code. Visual Studio Code generates a launch. json (under a . vscode folder in your project) with almost all of the required information.
Go to the 'Help' tab in the top menu and then select 'Welcome'. Look at the bottom of the page and click the checkbox below that says 'Show welcome page on startup'.
Add this into your .vscode/tasks.json in a project folder to run a script or execute a command when you open the folder in VS code:
{
"version": "2.0.0",
"tasks": [
{
"label": "Launch app", // Name of task
"type": "shell",
"command": "npm start", // Enter your command here
"group": "none",
"presentation": {
"reveal": "always",
"panel": "new"
},
"runOptions": {
"runOn": "folderOpen"
}
}
]
}
Then you need to enable automatic tasks:
> Tasks: Manage Automatic Tasks in Folder
Your task will execute next time you open VS Code in that folder.
Update August 12, 2019
@Andrew Wolfe had a great point in the comments, asking about workspace activation events. As I implement similar configurations in future projects, I will probably go in that direction.
Original answer:
Ended up using @HansPassant's solution: https://code.visualstudio.com/docs/editor/tasks#_custom-tasks
So something similar to this in my .vscode/tasks.json
file:
{
"version": "2.0.0",
"tasks": [
{
"label": "Launch Ngrok",
"type": "shell",
"command": "ngrok http -subdomain=<SUBDOMAIN> <PORT>",
"windows": {
"command": "ngrok http -subdomain=<SUBDOMAIN> <PORT>"
},
"group": "none",
"presentation": {
"reveal": "always",
"panel": "new"
}
},
{
"label": "Launch App",
"type": "shell",
"command": "npm start",
"windows": {
"command": "npm start"
},
"group": "none",
"presentation": {
"reveal": "always",
"panel": "new"
}
}
]
}
I also saved my project as a named Workspace, so that I can quickly identify which project I am looking at as I cycle through open projects.
Added a similar tasks.json
file in .vscode
for every project, and then just use the command palette to kick off each task every time I want to work on something.
Each app has different requirements for dependencies which need to be running simultaneously, some start via node locally, some I am starting on a remote server, some I need to have TypeScript always running, and then Rsync to the remote dev server (and bound the Rsync task to cmd+option+s for quick updates, more here).
This solution makes all of the above a breeze, and saves me from having to remember the magic incantation to get each project running every time.
Yes, extensions have access to node so they can run pretty much any scripts. You can also launch shell scripts within the VS Code terminal using the VS Code extension API.
Use activation events to start your extension when a user loads a workspace. The workspaceContains
is probably the best fit.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With