VS Code Ext Commands

An AI skill that generates VS Code extension command definitions, creating typed command registrations, keybinding configurations, palette entries, and handler implementations for building feature rich Visual Studio Code extensions.

What Is This?

Overview

This skill produces command infrastructure for VS Code extensions. It generates the command registration code in the extension activation function, TypeScript handler implementations, package.json contributions for command palette entries and keybindings, and context menu integrations. Each generated command includes proper disposal handling, error boundaries, and integration with VS Code's command system following extension development best practices.

Who Should Use This

Designed for VS Code extension developers who need to add commands quickly, teams building internal tooling extensions, and developers learning extension development who want correctly structured command implementations as starting points.

Why Use It?

Problems It Solves

VS Code commands require coordinated changes across multiple files: command registration in TypeScript, contributions in package.json, and optional keybinding definitions. Getting the command ID, context conditions, and activation events aligned correctly involves careful cross referencing. Missing any piece results in commands that do not appear or fail silently.

Core Highlights

• Full Command Scaffold generates registration, handler, and package.json entries
• Keybinding Configuration creates platform specific keyboard shortcuts
• Context Menus adds commands to editor, explorer, and tab context menus
• When Clauses configures visibility conditions for commands
• Disposal Management registers commands with proper cleanup on deactivation

How to Use It?

Basic Usage

Describe the command and receive all necessary code and configuration.

// Generated: src/commands/formatSelection.ts
import * as vscode from "vscode";

export function registerFormatSelectionCommand(
  context: vscode.ExtensionContext
): void {
  const command = vscode.commands.registerTextEditorCommand(
    "myExtension.formatSelection",
    async (editor) => {
      const selection = editor.selection;
      if (selection.isEmpty) {
        vscode.window.showWarningMessage("No text selected");
        return;
      }
      const text = editor.document.getText(selection);
      const formatted = formatText(text);
      await editor.edit((edit) => edit.replace(selection, formatted));
    }
  );
  context.subscriptions.push(command);
}

Real-World Examples

Multi Command Extension Setup

A team building a code annotation extension needed five commands: add annotation, remove annotation, list all annotations, export annotations, and navigate to next annotation. The skill generated all command handlers, package.json entries, and keybindings in one pass.

{
  "contributes": {
    "commands": [
      {
        "command": "annotator.addAnnotation",
        "title": "Add Annotation",
        "category": "Annotator"
      },
      {
        "command": "annotator.removeAnnotation",
        "title": "Remove Annotation",
        "category": "Annotator"
      }
    ],
    "keybindings": [
      {
        "command": "annotator.addAnnotation",
        "key": "ctrl+shift+a",
        "mac": "cmd+shift+a",
        "when": "editorTextFocus"
      }
    ]
  }
}

Advanced Tips

Group related commands under a category so they appear together in the command palette. Use when clause contexts to show commands only when relevant, such as only in specific file types. Register commands lazily through activation events to avoid slowing down VS Code startup.

When to Use It?

Use Cases

• New Extension Setup scaffold the initial command infrastructure
• Feature Addition add commands to existing extensions quickly
• Context Menu Integration add right-click actions for specific file types
• Keyboard Shortcuts create platform-aware keybinding configurations
• Command Palette register discoverable commands for end users

Related Topics

When building VS Code extension commands, these prompts activate the skill:

• "Generate VS Code extension commands"
• "Add a command to my VS Code extension"
• "Create keybindings for my extension commands"
• "Scaffold command handlers for my extension"

Important Notes

Requirements

• VS Code extension project with package.json and TypeScript configuration
• Understanding of the VS Code extension API for customizing generated handlers
• Node.js environment for extension development and testing
• VS Code Extension Development Host for testing commands

Usage Recommendations

Do:

• Use descriptive command IDs following the extensionName.actionName pattern
• Add commands to context.subscriptions for proper cleanup on deactivation
• Include when clauses to control command visibility in different contexts
• Test commands in the Extension Development Host before publishing

Don't:

• Register commands outside activation as they will not be available
• Use generic keybindings that conflict with built-in VS Code shortcuts
• Skip error handling in handlers as unhandled errors crash silently
• Forget activation events in package.json since commands need them to load

Limitations

• Generated handlers contain placeholder logic that needs custom implementation
• Complex multi-step commands may need manual state management additions
• Keybinding conflicts with other extensions cannot be detected at generation time
• Some advanced VS Code APIs require additional permission declarations