VS Code 커맨드 팔레트 3부｜Tasks와 runCommands로 반복 작업 자동화

VS CODE 초보자 시리즈 · 커맨드 팔레트 3부

반복 작업을 한 번에 실행하는
Tasks와 runCommands 입문

코드 편집 명령은 순서대로 묶고, 프로젝트 검사와 실행은 Task로 정의한 뒤 커맨드 팔레트와 단축키에서 다시 사용하는 흐름을 실습합니다.

이번 편의 핵심
1부에서는 명령을 찾고 실행하는 방법을, 2부에서는 파일·심볼·줄 이동과 단축키 지정을 익혔습니다. 3부에서는 반복 작업을 매번 검색하지 않도록 runCommands와 tasks.json으로 묶어 재사용합니다.

목차

1. 두 자동화 방식의 차이
2. 왜 필요하고 언제 사용하는가
3. 예제 프로젝트 준비하기
4. 첫 번째 Task 만들기
5. 여러 Task를 순서대로 실행하기
6. Task를 단축키에 연결하기
7. runCommands로 편집 명령 묶기
8. 전체 작업 흐름 실습하기
9. 정상 결과 확인하기
10. 자주 하는 실수와 복구 방법
11. 직접 따라 하기와 연습 과제
12. 다음 편 예고

1. 두 자동화 방식의 차이

runCommands와 Tasks는 모두 반복 작업을 줄이지만 대상으로 삼는 작업이 다릅니다.

구분	runCommands	Tasks
주요 목적	여러 VS Code 명령을 순서대로 실행	스크립트나 외부 프로세스를 VS Code에서 실행
작성 위치	사용자 keybindings.json	Workspace의 .vscode/tasks.json
대표 사례	줄 복제 → 원본 주석 처리 → 커서 이동	프로젝트 검사 → 애플리케이션 실행
재사용 방법	지정한 키 입력	Terminal 메뉴, 커맨드 팔레트, 단축키
적용 범위	사용자 단축키 설정	현재 Workspace 또는 폴더

먼저 구분하세요
편집기 안에서 실행되는 명령을 이어 붙이고 싶다면 runCommands, 터미널에서 실행할 검사·빌드·테스트·스크립트를 정의하고 싶다면 Task가 더 자연스럽습니다.

2. 왜 필요하고 언제 사용하는가

초보자는 반복 작업을 터미널에 매번 다시 입력하거나, 커맨드 팔레트에서 같은 명령을 계속 검색하는 경우가 많습니다. 작업을 자동화하면 실행 순서가 일정해지고 입력 실수도 줄일 수 있습니다.

상황	추천 기능	이유
같은 편집 명령을 연속으로 사용	runCommands	여러 VS Code 명령을 한 키에 연결
긴 터미널 명령을 자주 실행	Task	명령을 tasks.json에 이름과 함께 저장
검사 후 실행처럼 순서가 중요	Compound Task	dependsOn과 dependsOrder로 실행 순서 정의
팀원이 같은 명령을 사용해야 함	Workspace Task	프로젝트의 .vscode/tasks.json을 함께 관리 가능
Task를 키 하나로 실행	Task 단축키	workbench.action.tasks.runTask에 Task 이름 전달

Task는 폴더 또는 Workspace를 열었을 때 사용합니다
VS Code 공식 문서에 따르면 Task 지원은 단일 파일만 편집하는 상태에서는 사용할 수 없습니다. 실습 폴더 전체를 열고 진행하세요.

3. 예제 프로젝트 준비하기

이번 실습은 별도 패키지 설치 없이 Node.js 명령을 사용할 수 있는 환경을 전제로 합니다. 1·2부의 command-palette-lab 폴더를 계속 사용해도 되고, 아래 구조로 새로 만들어도 됩니다.

command-palette-lab/
├─ src/
│  └─ app.js
├─ scripts/
│  └─ check-project.js
├─ .vscode/
│  └─ tasks.json
└─ README.md

src/app.js

const todos = [
  { id: 1, text: "Tasks 실습", done: true },
  { id: 2, text: "runCommands 실습", done: false }
];

const completedCount = todos.filter((todo) => todo.done).length;

console.log(`전체 할 일: ${todos.length}개`);
console.log(`완료한 일: ${completedCount}개`);
console.table(todos);

scripts/check-project.js

const fs = require("node:fs");

const requiredFiles = [
  "README.md",
  "src/app.js"
];

const missingFiles = requiredFiles.filter(
  (file) => !fs.existsSync(file)
);

if (missingFiles.length > 0) {
  console.error("필수 파일이 없습니다:");
  missingFiles.forEach((file) => console.error(`- ${file}`));
  process.exitCode = 1;
} else {
  console.log("프로젝트 검사 통과: 필수 파일이 모두 있습니다.");
}

README.md

# Command Palette Lab

VS Code Tasks와 runCommands를 연습하는 예제 프로젝트입니다.

준비 확인
VS Code에서 command-palette-lab 폴더 자체를 열고, Explorer에 src, scripts, .vscode 폴더가 보이는지 확인합니다.

4. 첫 번째 Task 만들기

Task는 Workspace의 .vscode/tasks.json에 정의합니다. 공식 문서의 흐름대로 Terminal → Configure Tasks를 선택하고, 새 파일을 만들 때 Create tasks.json file from template → Others를 선택합니다.

생성된 파일의 내용을 다음으로 교체합니다.

{
  "version": "2.0.0",
  "tasks": [
    {
      "label": "Check project",
      "type": "process",
      "command": "node",
      "args": ["scripts/check-project.js"],
      "options": {
        "cwd": "${workspaceFolder}"
      },
      "presentation": {
        "reveal": "always",
        "panel": "new"
      }
    },
    {
      "label": "Run app",
      "type": "process",
      "command": "node",
      "args": ["src/app.js"],
      "options": {
        "cwd": "${workspaceFolder}"
      },
      "presentation": {
        "reveal": "always",
        "panel": "new"
      }
    }
  ]
}

label은 Task 목록에서 보이는 이름이고, type이 process이면 command를 프로세스로 실행합니다. args에는 명령에 전달할 인수를 배열로 적습니다.

개별 Task 실행하기

1. Terminal → Run Task를 선택합니다.
2. Check project를 선택합니다.
3. Integrated Terminal에 검사 결과가 표시되는지 확인합니다.
4. 같은 방법으로 Run app도 실행합니다.

정상 결과
Check project에서는 “프로젝트 검사 통과”가 표시되고, Run app에서는 전체 할 일 수와 완료한 일 수, 할 일 표가 출력됩니다.

5. 여러 Task를 순서대로 실행하기

공식 문서의 Compound Tasks 기능은 작은 Task를 dependsOn으로 묶을 수 있습니다. 여러 의존 Task는 기본적으로 병렬 실행되므로, 검사 후 실행처럼 순서가 중요할 때는 dependsOrder를 sequence로 지정합니다.

tasks 배열 끝에 다음 Task를 추가합니다.

{
  "label": "Verify and Run",
  "dependsOrder": "sequence",
  "dependsOn": [
    "Check project",
    "Run app"
  ]
}

전체 tasks.json에서는 이 객체가 Check project와 Run app 객체 뒤에 쉼표로 구분되어 들어가야 합니다.

1. Terminal → Run Task를 선택합니다.
2. Verify and Run을 실행합니다.
3. 프로젝트 검사가 끝난 뒤 애플리케이션이 실행되는지 확인합니다.

왜 작은 Task로 나누나요?
검사만 필요할 때는 Check project를, 실행만 필요할 때는 Run app을 사용할 수 있고, 전체 확인이 필요할 때만 Verify and Run을 실행할 수 있습니다.

6. Task를 단축키에 연결하기

자주 실행하는 Task는 workbench.action.tasks.runTask 명령에 Task의 label을 인수로 전달해 단축키에 연결할 수 있습니다.

1. File → Preferences → Keyboard Shortcuts를 엽니다.
2. 편집기 오른쪽 위의 Open Keyboard Shortcuts (JSON) 버튼을 선택합니다.
3. 배열 안에 다음 규칙을 추가합니다.

[
  {
    "key": "ctrl+alt+v",
    "command": "workbench.action.tasks.runTask",
    "args": "Verify and Run"
  }
]

ctrl+alt+v는 실습용 예시입니다. 기존 사용자 규칙이 있다면 배열을 새로 만들지 말고 기존 항목 뒤에 쉼표를 넣어 추가합니다.

단축키 충돌을 먼저 확인하세요
Keyboard Shortcuts 편집기에서 같은 키를 검색하거나 항목을 오른쪽 클릭해 Show Same Keybindings를 확인합니다. 충돌이 있다면 다른 조합으로 바꾸세요.

7. runCommands로 편집 명령 묶기

runCommands는 여러 VS Code 명령을 배열 순서대로 실행합니다. 다음 예제는 공식 문서에 제시된 흐름으로, 현재 줄을 아래로 복사하고 원본 줄을 주석 처리한 뒤 커서를 복사된 줄로 이동합니다.

keybindings.json 배열에 다음 규칙을 추가합니다.

{
  "key": "ctrl+alt+c",
  "command": "runCommands",
  "args": {
    "commands": [
      "editor.action.copyLinesDownAction",
      "cursorUp",
      "editor.action.addCommentLine",
      "cursorDown"
    ]
  }
}

예제 프로젝트에서 확인하기

1. src/app.js를 엽니다.
2. console.log(`완료한 일: ...`); 줄에 커서를 둡니다.
3. Ctrl + Alt + C를 누릅니다.
4. 원본 줄은 주석 처리되고 같은 줄이 아래에 복사되는지 확인합니다.

정상 결과 예시

// console.log(`완료한 일: ${completedCount}개`);
console.log(`완료한 일: ${completedCount}개`);

8. 전체 작업 흐름 실습하기

이제 편집 명령과 Task 자동화를 한 흐름으로 연결합니다.

1단계 · 코드 수정
src/app.js에서 runCommands 단축키를 사용해 로그 줄을 복사하고 원본을 주석 처리합니다.

2단계 · 프로젝트 검사와 실행
Ctrl + Alt + V를 눌러 Verify and Run Task를 실행합니다.

3단계 · 실패 상황 만들기
Explorer에서 README.md의 이름을 잠시 README-old.md로 바꾸고 Verify and Run을 다시 실행합니다.

4단계 · 복구
검사 실패 메시지를 확인한 뒤 파일 이름을 README.md로 되돌리고 Task를 다시 실행합니다.

9. 정상 결과 확인하기

• README.md와 src/app.js가 모두 있으면 Check project가 성공 메시지를 출력합니다.
• Verify and Run에서는 Check project가 끝난 뒤 Run app이 실행됩니다.
• README.md가 없으면 검사 스크립트가 누락 파일을 출력하고 실패 상태로 종료됩니다.
• runCommands 단축키는 현재 줄을 복제하고 원본을 주석 처리합니다.
• 키보드 단축키를 누르면 Task 선택 목록을 다시 열지 않고 Verify and Run이 실행됩니다.

확인 포인트
Task의 출력이 예상과 다르면 먼저 Terminal에 실제로 실행된 명령과 현재 작업 폴더가 무엇인지 확인하세요. options.cwd를 ${workspaceFolder}로 지정한 이유도 프로젝트 루트를 기준으로 파일을 찾기 위해서입니다.

10. 자주 하는 실수와 복구 방법

문제	가능한 원인	복구 방법
Run Task 목록에 Task가 안 보임	단일 파일만 열었거나 tasks.json 위치가 잘못됨	프로젝트 폴더를 열고 .vscode/tasks.json 위치 확인
JSON 오류가 표시됨	쉼표·괄호·따옴표 누락	Problems 표시와 tasks.json IntelliSense를 이용해 문법 수정
Verify and Run 순서가 뒤섞임	dependsOrder를 생략함	"dependsOrder": "sequence" 추가
단축키를 눌러도 다른 명령이 실행됨	같은 키가 다른 명령에도 지정됨	Show Same Keybindings 또는 Keyboard Shortcuts Troubleshooting으로 충돌 확인
Task 단축키에서 Task를 찾지 못함	args가 Task의 label과 다름	대소문자와 공백을 포함해 이름을 동일하게 수정
runCommands 결과가 예상과 다름	커서가 편집기 줄에 없거나 명령 순서가 변경됨	편집기에 포커스를 두고 공식 예제 순서로 복원
사용자 단축키를 원복하고 싶음	실습 규칙이 더 이상 필요하지 않음	Keyboard Shortcuts 편집기에서 해당 항목을 제거하거나 keybindings.json 객체 삭제

11. 직접 따라 하기와 연습 과제

직접 따라 하기 체크리스트

• command-palette-lab 폴더 전체를 VS Code에서 열었다.
• Check project와 Run app Task를 각각 실행했다.
• Verify and Run Compound Task를 순차 실행했다.
• Task 이름을 인수로 전달하는 단축키를 만들었다.
• runCommands로 네 개의 편집 명령을 순서대로 실행했다.
• README.md 이름을 바꿔 실패 상황을 만들고 다시 복구했다.

연습 과제 1 · 세 번째 검사 항목 추가

scripts/check-project.js의 requiredFiles 배열에 .vscode/tasks.json을 추가하고 검사 결과가 바뀌는지 확인합니다.

연습 과제 2 · Task 출력 패널 비교

한 Task의 presentation.panel을 dedicated로 바꾸고, 공식 문서에 설명된 new 동작과 출력 터미널 재사용 방식이 어떻게 다른지 비교합니다.

연습 과제 3 · 나만의 runCommands 만들기

Keyboard Shortcuts 편집기와 기본 단축키 JSON에서 사용할 명령 ID를 확인한 뒤, 편집 명령 두 개를 순서대로 실행하는 새 규칙을 만듭니다. 예상과 다르게 동작하면 규칙을 제거해 원복합니다.

12. 다음 편 예고

커맨드 팔레트 4부 · Tasks 문제 해결편
다음 편에서는 Task 출력에서 오류를 찾아 Problems 패널로 연결하는 Problem Matcher의 개념과, 자동 감지 Task를 프로젝트에 맞게 수정하는 방법을 초보자용 예제로 이어갑니다.

공식 참고 자료

2026년 8월 2일 확인. 최신 Stable은 VS Code 1.131로 2026년 7월 29일 공개되었고, 최신 Insiders 문서는 VS Code 1.132로 표시되며 공식 페이지 최종 갱신일은 2026년 7월 29일입니다.

• VS Code Release Notes Archive
• Visual Studio Code 1.131 Release Notes
• Visual Studio Code 1.132 Insiders Release Notes
• Keyboard shortcuts for Visual Studio Code
• Integrate with External Tools via Tasks