How to Create and Publish a VS Code Extension

📦 Step 1: Install Required Tools
We started by installing the Yeoman generator for VS Code:

npm install -g yo generator-code

Then we used the generator to scaffold a new extension:

yo code

💡 This gives you multiple options like creating a TypeScript/JavaScript extension, web extension, or even a theme/snippet pack. We selected the basic TypeScript extension for this demo.

⚙️ Step 2: Install the VSCE Publisher Tool
VSCE (Visual Studio Code Extension) is the CLI tool used to package and publish your extension to the marketplace.

We installed it using:

npm install -g @vscode/vsce

⚠️ If you see a warning like EBADENGINE, it means your Node.js version is slightly outdated. VSCE is asking for Node >=20.18.1, while you have v20.17.0. Consider updating Node.js if issues persist.

🔐 Step 3: Get a Personal Access Token (PAT)
To publish to the VS Code Marketplace, you need a Personal Access Token (PAT) from your Microsoft account via Azure DevOps. Here's how:

Go to: https://dev.azure.com

Sign in using your Microsoft or GitHub account.

In the top-right corner, click on your profile picture → "Personal access tokens".

Click New Token:

Organization: All accessible organizations

Scopes: Select only "Marketplace" → "Manage"

Expiry: You can choose 90 days or custom

Save the token (copy it somewhere safe — it's shown once).

👤 Step 4: Create a Publisher
Before publishing, you need to create a publisher (your dev alias or brand name):

vsce create-publisher your-publisher-name

You'll be asked for:

Your Personal Access Token

Publisher display name

This will register your publisher to the VS Code Marketplace.

📦 Step 5: Package Your Extension
Now, navigate into your extension folder and run:

vsce package

This will generate a .vsix file (e.g., my-extension-0.0.1.vsix) that contains your whole extension, ready for publishing or manual installation.

🚀 Step 6: Publish to Marketplace
Once packaged, you can publish directly:

vsce publish

Or specify a version bump manually:

vsce publish minor
vsce publish major
vsce publish patch

🔑 You'll be prompted for your PAT again unless it's cached.

🎯 Optional: Install Locally for Testing
Before publishing, you can test your .vsix locally by running:

code --install-extension my-extension-0.0.1.vsix

💰 Do People Earn from Publishing Extensions?
Publishing alone doesn’t pay. However, you can monetize in several ways:

Offer pro features via APIs or subscriptions

Integrate SaaS tools (e.g., integrations with GPT, Firebase, etc.)

Offer paid versions outside the marketplace

Accept donations via GitHub Sponsors or Buy Me a Coffee

Build a portfolio/brand that leads to freelance or dev job offers

✅ Final Thoughts
Now that your extension is published:

Track downloads & installs via Visual Studio Marketplace

Update frequently with new features and fixes

Share it on GitHub, Reddit, Twitter, and developer forums