https://github.com/zaydek/vscode-extension-task-drawer
https://github.com/zaydek/vscode-extension-task-drawer
Last synced: 24 days ago
JSON representation
- Host: GitHub
- URL: https://github.com/zaydek/vscode-extension-task-drawer
- Owner: zaydek
- License: mit
- Created: 2025-02-23T11:32:30.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2025-02-23T11:34:36.000Z (over 1 year ago)
- Last Synced: 2025-02-23T12:25:47.195Z (over 1 year ago)
- Language: TypeScript
- Size: 0 Bytes
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
README
# Task Drawer
This is a lightweight VS Code extension that creates an Explorer View (a small, resizable panel in the sidebar) that corresponds to your `.vscode/tasks.json` file.
If you use a `package.json` or a `Makefile`, this is a useful way to provide a UI layer for common tasks that you run in your project. This is especially useful if you need to orchestrate multiple tasks together. Alternatively, you could use something like `concurrently` (from NPM), but sometimes it's hard to decipher logs from multiple commands, so why not keep the terminals separate? That's why I made this for myself.
Note that this is not specific to any programming language or environment. It can be generally used with any project that exposes a `.vscode/tasks.json` file.
## Installation
- Install the extension from the [Marketplace](https://marketplace.visualstudio.com/items?itemName=zaydek.task-drawer) or by searching for "Task Drawer" in the Extensions sidebar.
- Add a `.vscode/tasks.json` file to your workspace with your tasks. If you don't see the Explorer View immediately, invoke `Extensions: Refresh` from the Command Palette (`Cmd+Shift+P` or `Ctrl+Shift+P`).
Here's an example of a simple `.vscode/tasks.json` file:
```json
{
"version": "2.0.0",
"tasks": [
{
"label": "π Build",
"type": "shell",
"command": "echo Building project..."
},
{
"label": "β
Test",
"type": "shell",
"command": "echo Running tests..."
}
]
}
```

And here's a more complex example that strings together multiple tasks:
```json
{
"version": "2.0.0",
"tasks": [
{
"label": "π Build",
"type": "shell",
"command": "echo Building project..."
},
{
"label": "β
Test",
"type": "shell",
"command": "echo Running tests..."
},
{
"label": "π§ Build and Test",
"dependsOn": ["π Build", "β
Test"]
}
]
}
```

And finally, this is the task I originally built this extension to support:
```json
{
"version": "2.0.0",
"tasks": [
{
"label": "dev:stylex",
"type": "shell",
"command": "make compile-stylex-dev",
"problemMatcher": [],
"group": {
"kind": "build"
},
"presentation": {
"reveal": "always",
"group": "dev-group"
}
},
{
"label": "dev:bun",
"type": "shell",
"command": "make compile-bun-dev",
"problemMatcher": [],
"group": {
"kind": "build"
},
"presentation": {
"reveal": "always",
"group": "dev-group"
}
},
{
"label": "dev",
"dependsOn": ["dev:stylex", "dev:bun"],
"group": {
"kind": "build",
"isDefault": true
}
},
{
"label": "prod",
"type": "shell",
"command": "make compile-bun-prod",
"problemMatcher": [],
"group": {
"kind": "build"
},
"presentation": {
"reveal": "always",
"panel": "new"
}
},
{
"label": "prod-serve",
"type": "shell",
"command": "make compile-bun-prod-serve",
"problemMatcher": [],
"group": {
"kind": "build"
},
"presentation": {
"reveal": "always",
"panel": "new"
}
}
]
}
```

This should give you an idea of when and why this extension can be useful.
[You can learn more about VS Code Tasks here](https://code.visualstudio.com/docs/editor/tasks).
## Features
This extension refreshes automatically when you save your `.vscode/tasks.json` file, specifically on file save. If for any reason you want to manually refresh the extension, you can invoke the `Task Drawer: Refresh` command from the Command Palette (`Cmd+Shift+P` or `Ctrl+Shift+P`).
You can run tasks by clicking on them in the Explorer View. This extension does not automatically invoke tasks; it simply provides a UI for you to run them yourself. Note that VS Code does support many behaviors for tasks. [You can learn more about them here](https://code.visualstudio.com/docs/editor/tasks#_run-behavior).
You can also invoke tasks from the Command Palette (`Cmd+Shift+P` or `Ctrl+Shift+P`). Search for `Task Drawer: Run Taskβ¦` and then clicking into the task you want to run.
This extension should be compatible with all VS Code forks, such as Cursor, Windsurf, etc. Feel free to [open an issue](https://github.com/zaydek/vscode-extension-task-drawer/issues) if you encounter any problems.
## Contributing
This extension is open source; contributions and forking are welcome. [The repo is here](https://github.com/zaydek/vscode-extension-task-drawer).
## License
Licensed as [MIT](https://github.com/zaydek/vscode-extension-task-drawer/blob/main/LICENSE).