vscode-extension-guide-en

npx skills add sickn33/agentic-awesome-skills --skill vscode-extension-guide-en --agent claude-code

Same command for any agent — swap --agent for codex, cursor, copilot.

# VS Code Extension Guide (English) ## Overview An English guide for building VS Code extensions, covering the full lifecycle from scaffolding to Marketplace publication. Includes reference material on webview patterns, CSP security, TreeView, testing, packaging and troubleshooting. Updated for VS Code 1.74+ APIs. Adapted from aktsmm/agent-skills (CC BY-NC-SA 4.0), translated to English with corrections for current VS Code APIs. ## When to Use This Skill - Use when creating a new VS Code extension from scratch - Use when adding commands, keybindings or settings to an extension - Use when building TreeView or Webview UI in an extension - Use when publishing an extension to the VS Code Marketplace - Use when troubleshooting extension activation or packaging issues ## How It Works ### Quick Start ```bash npm install -g yo generator-code yo code ``` ### Project Structure ``` my-extension/ ├── package.json # Extension manifest ├── src/extension.ts # Entry point ├── out/ # Compiled JS ├── images/icon.png # 128x128 PNG for Marketplace └── .vscodeignore # Exclude files from VSIX ``` ### Building and Packaging ```bash npm run compile # Build once npm run watch # Watch mode (F5 to launch deb

npm install -g yo generator-code
yo code
npm run compile           # Build once
npm run watch             # Watch mode (F5 to launch debug)
npx @vscode/vsce package  # Creates .vsix
npx skills add lewiswigmore/agent-skills --skill vscode-extension-guide-en