Add customizable buttons to the VS Code status bar that run terminal commands.
Features
- Status bar buttons with optional codicons, colors, tooltips
- Single buttons that run one or more terminal commands directly.
- Button groups that show a dropdown (Quick Pick) menu of multiple commands.
- Reuse the same terminal per button or create a fresh one every time
- Optional clear before run, custom working directory, focus behavior
- Quick pick command to run any configured button
Commands
- Command Buttons: Run Configured Command (
commandbuttons.runConfiguredCommand)
- Command Buttons: Reload Buttons (
commandbuttons.reloadButtons)
Configuration
Add entries under commandbuttons.buttons in your settings (User or Workspace):
Examples:
{
"commandbuttons.buttons": [
{
"text": "Run Task",
"tooltip": "Run a task...",
"alignment": "left",
"priority": 10,
"commands": [
{
"text": "Run Build",
"icon": "gear",
"tooltip": "Run npm build",
"command": "npm run build"
},
{
"text": "Run Tests",
"icon": "beaker",
"tooltip": "Run all tests",
"command": "npm test"
},
{
"text": "Run Lint",
"icon": "check",
"command": "npm run lint"
}
]
},
{
"id": "build",
"text": "Build",
"icon": "gear",
"tooltip": "Run npm build",
"command": "npm run build",
"alignment": "right",
"priority": 100,
"terminalName": "Build",
"clearBeforeRun": false,
"useNewTerminal": false,
"focusTerminal": true
},
{
"id": "test",
"text": "Test",
"icon": "beaker",
"tooltip": "Run tests",
"command": ["npm run lint", "npm test"],
"cwd": "${workspaceFolder}",
"alignment": "right",
"priority": 90
},
{
"text": "Dev Server",
"icon": "play",
"command": "npm run dev",
"confirmBeforeRun": true,
"confirmMessage": "Start the dev server?",
"useNewTerminal": true,
"focusTerminal": true
}
]
}
Notes:
icon uses VS Code codicons, e.g. play, gear, rocket.- If
id is omitted, one is derived automatically; set it to keep a stable terminal per button.
alignment can be left or right (default: right). Higher priority shows more left on the right side.command can be either a single command string or an array of command strings.- When a
commands (plural) array is defined, the button acts like a "folder" or group, containing the commands in the defined array.
- All commands in the group will appear in the Quick Pick menu upon clicking the group button.
- Grouped commands that show up in the Quick Pick menu aren't affected by
color or alignment.
Troubleshooting
- Buttons not showing: ensure you saved settings and that the array is valid JSON. Run "Reload Buttons".
- Terminal cwd: if not set, the first workspace folder is used when there is exactly one.
License
MIT
| |
