vscode-extension

Guide development of Visual Studio Code extensions with TypeScript and the VS Code API.

6|1|Updated Feb 27, 2026
One-click install
npx skills add https://github.com/RepairYourTech/cfsa-antigravity --skill vscode-extension-repairyourtech
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: vscode-extension
Source: https://github.com/RepairYourTech/cfsa-antigravity/tree/main/.agent/skill-library/stack/extensions/vscode-extension
Command: npx skills add https://github.com/RepairYourTech/cfsa-antigravity --skill vscode-extension-repairyourtech

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires vscode-languageclient/node, @vscode/vsce, ovsx, vscode-test, and includes scripts (resource) and references (resource) components.

What problem does it solve?

This Skill provides a comprehensive guide to developing robust and efficient Visual Studio Code extensions, enabling you to enhance the IDE with custom features and tooling.

Core Features & Use Cases

  • Extension Architecture: Understand the Extension Host, activation events, and lifecycle.
  • Contribution Points: Define commands, menus, keybindings, and settings.
  • UI Development: Implement TreeViews and Webview Panels for custom interfaces.
  • Language Features: Integrate diagnostics, autocompletion, and Language Server Protocol support.
  • Testing & Publishing: Learn to test your extensions and publish them to marketplaces.
  • Use Case: You need to create a new VS Code extension that adds custom code snippets and provides real-time linting for a specific programming language.

Quick Start

Use the vscode-extension skill to create a new VS Code extension that registers a command to display "Hello World".

Frequently Asked Questions about vscode-extension

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I build a VS Code extension with TypeScript and custom UI elements?

To build a VS Code extension, you define contribution points and implement UI components like TreeViews and Webview Panels using TypeScript and the VS Code API to enhance the editor interface.

How does the Language Server Protocol integrate with VS Code extension development?

The Language Server Protocol integrates by connecting your extension to a language server via the vscode-languageclient node module, enabling advanced features like diagnostics and autocompletion within the IDE.

What do I need to know to create custom IDE tooling and language support for VS Code?

Creating custom IDE tooling requires understanding TypeScript, the VS Code API, and package.json configuration to properly define activation events, commands, menus, and settings.

How do I test and publish VS Code extensions to marketplaces?

You test and publish VS Code extensions using the vscode-test framework for validation, and deploy them utilizing the @vscode/vsce and ovsx packaging tools to publish to the VS Code marketplace and Open VSX.

What is the VS Code Extension Host and how does it manage extension lifecycle?

The VS Code Extension Host is an isolated process that manages the extension lifecycle and activation events, ensuring your custom tooling runs efficiently without blocking the main editor thread.