VS Code extension

The PostHog VS Code extension brings feature flags, experiments, event analytics, and session replay data directly into your editor. It works with JavaScript, TypeScript, Go and Ruby files (.js, .jsx, .ts, .tsx, .go, .rb).

With it, you can see live analytics data inline in your code, manage feature flags without leaving your editor, clean up stale flags with AST-based refactoring, and jump to session replays for events in your codebase.

Note: This extension is different from the PostHog MCP server for VS Code, which enables AI agents and Copilot to interact with PostHog. The VS Code extension provides direct, visual tooling for developers in the editor. They complement each other.

Installation

Install directly from your editor:

Or install manually:

1. Open the Extensions panel (Cmd+Shift+X on Mac, Ctrl+Shift+X on Windows/Linux)
2. Search for "PostHog"
3. Click Install

The extension is also available on the VS Code Marketplace and the Open VSX Registry.

Requirements:

• VS Code 1.109.0 or later
• A PostHog account

Authentication

Once installed, authenticate the extension with your PostHog account:

1. Open the command palette (Cmd+Shift+P / Ctrl+Shift+P)
2. Run PostHog: Sign In
3. Click the sign-in button — this opens PostHog in your browser where you authenticate via OAuth
4. Once authenticated, run PostHog: Select Project to choose which project to connect to

After authenticating, the status bar at the bottom of VS Code shows your active project and last sync time.

Quick start

Once connected, the extension immediately starts analyzing your code:

• SDK initialization diagnostics help you verify that your PostHog init() calls are configured correctly, surfacing warnings if something looks off
• Inline decorations appear next to posthog.capture() calls showing 7-day event volume sparklines
• Feature flag status indicators show next to posthog.isFeatureEnabled() and posthog.getFeatureFlag() calls
• CodeLens actions appear above flag and capture calls with contextual links
• The sidebar populates with your feature flags, experiments, and saved insights

For details on each feature, see:

Team configuration

Share extension settings across your team by committing a .posthog.json file to your repository root:

{
    "projectId": 12345,
    "additionalClientNames": ["analytics"],
    "additionalFlagFunctions": ["useMyFlag"]
}

This ensures everyone on the team connects to the correct project and the extension recognizes your custom PostHog client variable names and flag wrapper functions.

Multi-project workspaces

If your VS Code workspace contains multiple folders connected to different PostHog projects, the extension detects this automatically. Each folder can have its own .posthog.json with a different projectId. The extension switches context as you navigate between files in different folders.

Set posthog.multiProjectNotifications to true (default) to get notified when the active project changes.

Automatic sync

The extension periodically refreshes its cache of feature flags, experiments, and event data from PostHog. The status bar shows when the last sync occurred. You can also manually refresh with the PostHog: Refresh Feature Flags command.

Configuration reference

Commands reference

Open the command palette (Cmd+Shift+P / Ctrl+Shift+P) and type "PostHog" to see all available commands.

Authentication and setup

Feature flags

Experiments

Session replay

Stale flags

Further reading

• PostHog VS Code extension on GitHub
• PostHog MCP server for VS Code — AI agent integration
• Feature flags documentation