Webucator Blog

How to Launch Files in a Browser from Visual Studio Code

Visual Studio Code doesn’t have a built-in method for launching HTML and other files in Google Chrome, but you can configure it to do so.

OSX Method

  1. Press CMD+Shift+P to open the Command Palette.
  2. Type “ctr” and select the Configure Task Runner command to open tasks.json.
  3. Delete the current placeholder contents.
  4. Enter the following:
    {
        "version": "0.1.0",
        "command": "Chrome",
        "osx": {
            "command": "/Applications/Google Chrome.app/Contents/MacOS/Google Chrome"
        },
        "args": ["${file}"]
    }
  5. To test it, open an HTML file in Visual Studio Code and press CMD+Shift+B. It should open in Chrome.

Windows Method

  1. Press Ctrl+Shift+P to open the Command Palette.
  2. Type “ctr” and select the Configure Task Runner command to open tasks.json.
  3. Delete the current placeholder contents.
  4. Enter the following:
    {
        "version": "0.1.0",
        "command": "Chrome",
        "windows": {
            "command": "C:\\Program Files (x86)\\Google\\Chrome\\Application\\chrome.exe"
        },
        "args": ["${file}"]
    }
  5. To test it, open an HTML file in Visual Studio Code and press Ctrl+Shift+B. It should open in Chrome.

The following pages helped me figure this out:

  1. How to Add a Browser to Task Runner in Visual Studio Code
  2. Stack Overflow: How to view my HTML code in browser with Visual Studio Code?

Related Training: Visual Studio

 


  • Adam Grey

    Thanx a lot!!!