⚙️ Lesson 19 of 40 Workflow Intermediate

Tasks, Build Systems & npm Scripts

VS Code's task system lets you run build commands, test runners, and scripts directly from the editor — with output streamed to a dedicated terminal and problem matchers that link errors back to source files.

48% complete

1What Are Tasks?

Tasks are configured commands that VS Code can run on your behalf. They can be triggered by a shortcut (Ctrl+Shift+B for the default build task), from the Command Palette (Run Task), or automatically on folder open.

2Auto-Detecting npm Scripts

VS Code reads your package.json and auto-detects all scripts as runnable tasks. Open Terminal › Run Task to see the full list. Right-click a script in the NPM Scripts sidebar to set one as the default build task.

3Creating tasks.json

.vscode/tasks.json
{
  "version": "2.0.0",
  "tasks": [{
    "label": "Build TypeScript",
    "type": "shell",
    "command": "tsc",
    "group": { "kind": "build", "isDefault": true },
    "problemMatcher": "$tsc"
  }]
}

4Problem Matchers

Problem matchers parse task output and turn errors/warnings into clickable items in the Problems panel. VS Code ships with matchers for $tsc, $eslint, $go, $gcc, and many more.

5Compound Tasks & Depends On

Chain tasks together with dependsOn — for example, run Clean then Build then Test as a single CI task. Use "dependsOrder": "sequence" to run them one after another.


All 40 Lessons
Pick any lesson to jump straight to it.
L01
Getting Started with VS Code
FoundationBeginner
L02
The VS Code Interface & Layout
FoundationBeginner
L03
Installing & Managing Extensions
ExtensionsBeginner
L04
Keyboard Shortcuts & Command Palette
ProductivityBeginner
L05
Settings, Themes & Customization
CustomizationBeginner
L06
IntelliSense & Code Completion
Editor FeaturesBeginner
L07
Integrated Terminal Mastery
ProductivityBeginner
L08
Search, Find & Replace Across Files
Editor FeaturesBeginner
L09
Git & Source Control with VS Code
Version ControlBeginner
L10
Snippets & Emmet Abbreviations
ProductivityBeginner
L11
GitHub Copilot — Getting Started
AI & CopilotIntermediate
L12
Copilot Chat & Inline Ask
AI & CopilotIntermediate
L13
JavaScript & TypeScript Development
LanguagesIntermediate
L14
Python Development in VS Code
LanguagesIntermediate
L15
Debugging Like a Pro
DebuggingIntermediate
L16
Linting, Formatting & ESLint
Code QualityIntermediate
L17
Multi-Cursor Editing & Refactoring
Editor FeaturesIntermediate
L18
Workspaces & Multi-Root Projects
WorkspaceIntermediate
L19
Tasks, Build Systems & npm Scripts
WorkflowIntermediate
L20
Testing with Jest, Vitest & Pytest
TestingIntermediate
L21
React Development Workflow
Web DevIntermediate
L22
Node.js & Express in VS Code
BackendIntermediate
L23
Docker & Dev Containers
DevOpsIntermediate
L24
Live Share — Real-Time Collaboration
CollaborationIntermediate
L25
Jupyter Notebooks in VS Code
Data ScienceIntermediate
L26
REST Client & API Testing
API DevIntermediate
L27
SSH Remote Development
Remote DevIntermediate
L28
WSL 2 Integration on Windows
Remote DevIntermediate
L29
Advanced Debugging: Breakpoints & Watch
DebuggingAdvanced
L30
Copilot Agent Mode — Agentic Workflows
AI & CopilotAdvanced
L31
Profile & Performance Optimisation
PerformanceAdvanced
L32
GitHub Actions & CI/CD Integration
DevOpsAdvanced
L33
Custom Keybindings & Key Maps
CustomizationAdvanced
L34
Settings Sync & Dotfiles Management
WorkflowAdvanced
L35
Language Server Protocol (LSP) Explained
InternalsAdvanced
L36
Rust Development in VS Code
LanguagesAdvanced
L37
Go Development in VS Code
LanguagesAdvanced
L38
GitHub Codespaces & vscode.dev
Remote DevExpert
L39
Writing Your First VS Code Extension
Extension DevExpert
L40
Pro VS Code Workflow & Mastery
MasteryExpert