'How to change default browser with VS Code's "open with live server"?

It defaults to my safari but would like to change it to chrome. I looked in preferences, but there doesn't seem to be an option for that. Any ideas?



Solution 1:[1]

Go to Files > Prefrences > Settings

From Default User settings choose LiveServer Config

Inside it click on pen icon to the left on liveServer.settings.CustomBrowser select chrome.

Solution 2:[2]

  1. Go into settings. Shortcut: hold command then comma on mac.
  2. In the top search bar search: liveServer.settings.CustomBrowser
  3. You will see: Live Server > Settings: Custom Browser
  4. In the drop down menu select whatever browser you want e.g. chrome or chrome:PrivateMode etc..

or

  1. Open settings.json file
  2. Type or copy and paste the following in the next line: "liveServer.settings.CustomBrowser": "chrome"
  3. Make sure that there is a comma after the code in the previous line.

e.g.

"editor.formatOnSave": true,
"liveServer.settings.CustomBrowser": "chrome"

Solution 3:[3]

This is how I did it on MacOS (you have to hit the gear, then select "Configure Extension Settings")

enter image description here

Solution 4:[4]

Thanks! to above answers. On Mac select VS and press [command + ,] or from menubar choose code->Preferences->Settings. It will open the Settings tab and enter live server config in search bar follow the steps given below

enter image description here

Solution 5:[5]

I was also looking for this, while trying to change to Google Chrome Dev.

And discovered you can practically change to any browser you want, just type the name of the app on your settings.json

Example:

"liveServer.settings.CustomBrowser": "Google Chrome Dev"

Solution 6:[6]

You can do it in 2 steps:-
1) In package.json under scripts section create a key value as "devserver": "live-server --browser=Chrome".
2) In terminal run npm run devserver

This will open application in chrome.

Solution 7:[7]

How to customize your non-traditional browser in "liveServer"?

  1. Go to Files > Preferences > Settings and search .json and click on settings.json file
  2. or press SHIFT + CTRL + P and tab Preferences: Open Settings (JSON)

  3. Write on JSON file

"liveServer.settings.AdvanceCustomBrowserCmdLine": To set your any favorite browser (Eg: Chrome Canary, Firefox Nightly) using advance Command Line. (You can specify full path of your favorite custom browser).

  • This setting will override "CustomBrowser" and "ChromeDebuggingAttachment" settings.
  • Default Value is null
  • Examples:
    • chrome --incognito --headless --remote-debugging-port=9222
    • C:\Program Files\Firefox Developer Edition\firefox.exe --private-window

Check out my photo or see this link on GitHub for more details.

Note: Either use "AdvanceCustomBrowserCmdLine" or "CustomBrowser". If you use both, "AdvanceCustomBrowserCmdLine" has higher priority.

Solution 8:[8]

  • Click windows+i
  • Choose Apps
  • Choose default apps
  • Change (web browser ) to chrome (by change anyway)

Solution 9:[9]

If you are using the live server extension https://github.com/ritwickdey/vscode-live-server it has this setting:

liveServer.settings.CustomBrowser:

To change your system's default browser. Default value is "Null" [String, not null]. (It will open your system's default browser.) Available Options : chrome chrome:PrivateMode firefox firefox:PrivateMode microsoft-edge

Solution 10:[10]

If you had installed globally your live-server while using npm package, you can easily start your live-server on the browser of your choice by passing browser option on your launching command:

On your terminal type :live-server --browser=BROWSER_NAME Eg: live-server --browser=firefox, live-server --browser=safari

and some macbooks accepts live-server --browser='Google Chrome' for google chrome while others live-server --browser=google-chrome NB:For mac live-server --browser=chrome will throw an error

Solution 11:[11]

On Mac, via VS Code menu:

Code > Preferences > Settings > type browser in the Search settings box at the top

Solution 12:[12]

open the visual studio and go to file - preferences - extension - right-click over Live server setting icon - then choose

edit in setting JSON then you will find that sentence

"liveServer.settings.AdvanceCustomBrowserCmdLine": ""

just put your browser name between the double quotes

Solution 13:[13]

liveServer.settings.CustomBrowser:To change your system's default browser.

  • Default value is null [String, not null]. (It will open your system's default browser.)

  • Available Options :

    • Chrome

    • chrome:PrivateMode

    • firefox

    • firefox:PrivateMode

    • microsoft-edge

    • blisk

Not enough? need more? open an/a issue/pull request on github. For now, use liveServer.settings.AdvanceCustomBrowserCmdLine settings (see below).

  • liveServer.settings.AdvanceCustomBrowserCmdLine:To set your any favorite browser (Eg: Chrome Canary, Firefox Nightly) using advance Command Line. (You can specify full path of your favorite custom browser).

  • This setting will override CustomBrowser and ChromeDebuggingAttachment settings.

  • Default Value is null

  • Examples:

  • chrome --incognito --headless --remote-debugging-port=9222

  • C:\Program Files\Firefox Developer Edition\firefox.exe --private-window //Remove --Private-windows for normal Window

  • Note: Either use AdvanceCustomBrowserCmdLine or CustomBrowser. If you use both, AdvanceCustomBrowserCmdLine has higher priority.

Solution 14:[14]

steps (change default browser for open with Live Server)

  1. Go to File > Prefrences > Settings
  2. Copy and paste liveServer.settings.CustomBrowser into the Search settings bar
  3. Find the setting: Live Server › Settings: Custom Browser
  4. Choose chrome or chrome:PrivateMode from the dropdown menu

Next time you Open with Live Server or Go live, the extension will automatically open with Chrome (no need to restart VSCode).