Visual Studio Code is a powerful code editor, but sometimes you need to open files with their default applications. This guide shows you how to configure VS Code to open files with their associated programs on both macOS and Windows.

Prerequisites

Before you begin, ensure you have:

  • Visual Studio Code installed
  • Basic understanding of VS Code’s command palette
  • Appropriate file associations set up on your operating system

Configuring File Opening Tasks

For macOS Users

  1. Open the Command Palette (CMD + Shift + P)
  2. Type “Tasks: Configure Task” and select it
  3. Add the following JSON configuration:
{
  "version": "2.0.0",
  "tasks": [
    {
      "label": "Open file",
      "type": "shell",
      "command": "open",
      "args": ["${file}"]
    }
  ]
}

For Windows Users

  1. Open the Command Palette (Ctrl + Shift + P or F1)
  2. Type “Tasks: Configure Task” and select it
  3. Add the following JSON configuration:
{
  "version": "2.0.0",
  "tasks": [
    {
      "label": "Open file",
      "type": "shell",
      "command": "explorer.exe",
      "args": ["${file}"]
    }
  ]
}

Using the Task

After configuring the task:

  1. Open the file you want to view in its default application
  2. Open the Command Palette
  3. Type “Tasks: Run Task”
  4. Select “Open file”

Common Use Cases

  • Opening HTML files in your default browser
  • Viewing images in your system’s image viewer
  • Opening PDFs in your PDF reader
  • Playing media files in your media player

Troubleshooting

If the task doesn’t work as expected:

  1. Verify the file associations in your operating system
  2. Check if the file path contains spaces (they should work, but verify)
  3. Ensure you have the necessary permissions to open the file

Further Reading