Deep-dive on the Next Gen Platform. Join the Webinar!

Skip Navigation
Show nav
Dev Center
  • Get Started
  • Documentation
  • Changelog
  • Search
  • Get Started
    • Node.js
    • Ruby on Rails
    • Ruby
    • Python
    • Java
    • PHP
    • Go
    • Scala
    • Clojure
    • .NET
  • Documentation
  • Changelog
  • More
    Additional Resources
    • Home
    • Elements
    • Products
    • Pricing
    • Careers
    • Help
    • Status
    • Events
    • Podcasts
    • Compliance Center
    Heroku Blog

    Visit the Heroku Blog

    Find news and updates from Heroku in the blog.

    Visit Blog
  • Log inorSign up
Hide categories

Categories

  • Heroku Architecture
    • Compute (Dynos)
      • Dyno Management
      • Dyno Concepts
      • Dyno Behavior
      • Dyno Reference
      • Dyno Troubleshooting
    • Stacks (operating system images)
    • Networking & DNS
    • Platform Policies
    • Platform Principles
  • Developer Tools
    • Command Line
    • Heroku VS Code Extension
  • Deployment
    • Deploying with Git
    • Deploying with Docker
    • Deployment Integrations
  • Continuous Delivery & Integration (Heroku Flow)
    • Continuous Integration
  • Language Support
    • Node.js
      • Working with Node.js
      • Troubleshooting Node.js Apps
      • Node.js Behavior in Heroku
    • Ruby
      • Rails Support
      • Working with Bundler
      • Working with Ruby
      • Ruby Behavior in Heroku
      • Troubleshooting Ruby Apps
    • Python
      • Working with Python
      • Background Jobs in Python
      • Python Behavior in Heroku
      • Working with Django
    • Java
      • Java Behavior in Heroku
      • Working with Java
      • Working with Maven
      • Working with Spring Boot
      • Troubleshooting Java Apps
    • PHP
      • PHP Behavior in Heroku
      • Working with PHP
    • Go
      • Go Dependency Management
    • Scala
    • Clojure
    • .NET
      • Working with .NET
  • Databases & Data Management
    • Heroku Postgres
      • Postgres Basics
      • Postgres Getting Started
      • Postgres Performance
      • Postgres Data Transfer & Preservation
      • Postgres Availability
      • Postgres Special Topics
      • Migrating to Heroku Postgres
    • Heroku Key-Value Store
    • Apache Kafka on Heroku
    • Other Data Stores
  • AI
    • Working with AI
  • Monitoring & Metrics
    • Logging
  • App Performance
  • Add-ons
    • All Add-ons
  • Collaboration
  • Security
    • App Security
    • Identities & Authentication
      • Single Sign-on (SSO)
    • Private Spaces
      • Infrastructure Networking
    • Compliance
  • Heroku Enterprise
    • Enterprise Accounts
    • Enterprise Teams
    • Heroku Connect (Salesforce sync)
      • Heroku Connect Administration
      • Heroku Connect Reference
      • Heroku Connect Troubleshooting
  • Patterns & Best Practices
  • Extending Heroku
    • Platform API
    • App Webhooks
    • Heroku Labs
    • Building Add-ons
      • Add-on Development Tasks
      • Add-on APIs
      • Add-on Guidelines & Requirements
    • Building CLI Plugins
    • Developing Buildpacks
    • Dev Center
  • Accounts & Billing
  • Troubleshooting & Support
  • Integrating with Salesforce
  • Developer Tools
  • Heroku VS Code Extension
  • Heroku Extension for VS Code

Heroku Extension for VS Code

Last updated March 05, 2025

Table of Contents

  • Install the Heroku VS Code Extension
  • Sign in to Your Heroku Account
  • Access Your Heroku Apps in VS Code
  • Provision Add-ons from Elements Marketplace
  • Run Shell Scripts from the Editor
  • Explore the Command Palette
  • Deploy to Heroku
  • Additional Reading

The Heroku extension for Visual Studio Code (VS Code) brings all your essential developer tools into VS Code. With the extension, you can create and manage Heroku apps, make commits, and deploy code changes directly from VS Code. This extension also enables you to run Heroku CLI commands in the VS Code terminal, creating an all-in-one experience for developers.

Install the Heroku VS Code Extension

To get started, install the Heroku VS Code extension.

Prerequisites for Installation

  • VS Code 1.60.0 or later
  • Node.js 22.x or later
  • npm 10.x or later
  • Heroku CLI installed:
    • For CodeBuilder environments, run: npm install -g heroku
    • To verify installation, run: heroku --version

Install the Extension

  1. Launch VS Code.
  2. Open the Heroku extension in VS Code Marketplace, and click Install.
  3. Click Open Visual Studio Code in the pop-up window to redirect to VS Code.
  4. Click Install.

Verify Installation

After installation, you can view the Heroku extension in VS Code:

  • The Heroku icon is now available in the Activity Bar.
  • Open the Extensions panel (Ctrl+Shift+X or Cmd+Shift+X) to confirm:
    • The extension appears in your installed list.
    • The version number matches the most current release available in the VS Code Marketplace.

Test Installation

Test the extension after VS Code updates to make sure it works as expected:

  1. Open the Command Palette (Ctrl+Shift+P or Cmd+Shift+P).
  2. Type Heroku.
  3. If the installation was successful, several Heroku commands are available.

Troubleshooting Installation

If you run into any issues during installation:

  • Check your VS Code version.
  • Verify your Node.js and npm versions.
  • Confirm Heroku CLI is installed and working.
  • Document any error messages that appear and if issues persist, contact Heroku support.

Uninstall the Extension

To remove the extension:

  1. Open the Extensions panel in VS Code.
  2. Find and select the Heroku extension.
  3. Select Uninstall.
  4. Restart VS Code.

To clean up extension data, use the following:

For Windows:

rm -rf %USERPROFILE%\.vscode\extensions\heroku-vscode*

For macOS/Linux:

rm -rf ~/.vscode/extensions/heroku-vscode*

Sign in to Your Heroku Account

Signing in connects your Heroku account to VS Code and enables the extension to manage your apps and resources.

Sign in to Heroku in VS Code

  1. Open VS Code.
  2. Select the Heroku icon in the Activity Bar.
  3. Click Sign in. Sign in to Heroku in VS Code
  4. Complete the login process in your browser or terminal:
    • Your default browser opens automatically to the Heroku login page.
    • If you use CodeBuilder, open a terminal window and use heroku auth:login -i.
  5. Return to VS Code to confirm you’re logged into your Heroku account.

Verify Authentication

To verify authentication, confirm:

  • Your profile information is in the extension panel.
  • An authentication status icon is in the bottom-right corner.
  • Selecting your user icon displays your authentication status.
  • You have access to Heroku resources and commands.

Managing Your Session

Authentication persists between VS Code sessions, so you don’t sign in to Heroku each time you open VS Code.

To sign out:

  1. Select the user icon in the lower left corner of VS Code.
  2. Select your Heroku username, then click Sign Out.

On sign out, your session ends. Sign in again to access Heroku features.

Troubleshooting Authentication

Network Problems

If you can’t connect, check your internet connection and try again. The extension shows a retry option if authentication fails.

Authentication Sync Issues

If the extension can’t access your Heroku account:

  • Make sure your Heroku CLI is working correctly.
  • Try signing out and back in.
  • Check that you’re using the latest version of the extension.

Invalid Authentication

If your session becomes invalid, the extension detects the invalid session automatically. You’ll be prompted to sign in again and complete the authentication process.

Authentication Security

The Heroku VS Code extension uses the Heroku CLI for authentication. Heroku manages your credentials securely through the CLi and never stores them directly in the extension.

Access Your Heroku Apps in VS Code

To access your apps:

  1. Select the Heroku icon in the Activity Bar to view a list of all the Heroku apps associated with your account.

  2. Select an app to view its resources, including dynos, config vars, and add-ons.

  3. Right-click on an app to perform actions. You can view logs, scale dynos, or open the app in your browser.

Provision Add-ons from Elements Marketplace

Enhance your app’s capabilities with additional services like databases, monitoring tools, and more with Heroku’s Elements Marketplace.

  1. Select the Heroku icon in the Activity Bar to view a list of all the Heroku apps associated with your account.

  2. Select an app.

  3. Select Add-ons to open the Elements Marketplace.

  4. Select an add-on and follow the instructions to provision it to your app.

After provisioning, manage your add-on in VS Code with the Heroku Resource Explorer.

Run Shell Scripts from the Editor

With the Heroku VS Code extension, you can execute shell scripts that use the CLI commands within the editor. Use shell scripts to automate tasks such as deploying an app, scaling dynos, running migrations, and more.

Explore the Command Palette

You can run Heroku CLI commands quickly and efficiently from the Command Palette in VS Code without using the terminal.

  1. Open the Command Palette (Ctrl+Shift+P or Cmd+Shift+P).

  2. Type Heroku to see all the available Heroku commands.

  3. Select the command to execute. Heroku in Command Palette

Deploy to Heroku

Learn how to Deploy to Heroku from VS Code.

Additional Reading

Learn how to:

  • Link Heroku Apps to Your Workspace
  • Browse and Deploy Starter Apps in VS Code
  • View App Logs in VS Code
  • Monitor and Manage Real-time Updates in VS Code
  • Manage Dynos in VS Code

Keep reading

  • Heroku VS Code Extension

Feedback

Log in to submit feedback.

View App Logs in VS Code Link Heroku Apps to Your VS Code Workspace

Information & Support

  • Getting Started
  • Documentation
  • Changelog
  • Compliance Center
  • Training & Education
  • Blog
  • Support Channels
  • Status

Language Reference

  • Node.js
  • Ruby
  • Java
  • PHP
  • Python
  • Go
  • Scala
  • Clojure
  • .NET

Other Resources

  • Careers
  • Elements
  • Products
  • Pricing
  • RSS
    • Dev Center Articles
    • Dev Center Changelog
    • Heroku Blog
    • Heroku News Blog
    • Heroku Engineering Blog
  • Twitter
    • Dev Center Articles
    • Dev Center Changelog
    • Heroku
    • Heroku Status
  • Github
  • LinkedIn
  • © 2025 Salesforce, Inc. All rights reserved. Various trademarks held by their respective owners. Salesforce Tower, 415 Mission Street, 3rd Floor, San Francisco, CA 94105, United States
  • heroku.com
  • Legal
  • Terms of Service
  • Privacy Information
  • Responsible Disclosure
  • Trust
  • Contact
  • Cookie Preferences
  • Your Privacy Choices