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

Question

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?

score 66 · Answer 1 · answered Jul 29 '18 at 12:08

66

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.

answered Jul 29 '18 at 12:08

Aditya

2,358
6
35
61

Code > Preferences > Settings is correct. The first drop down is "Code" not "File", in VSCode. – Green Sep 07 '22 at 16:39

score 24 · Answer 2 · answered Oct 15 '19 at 09:41

24

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

or

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

e.g.

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

answered Oct 15 '19 at 09:41

Pat8

958
9
19

1

Follow this guys, this one is obviously an easy way to do it. Thank you btw. – Tuan Phan Jul 01 '20 at 03:29
@TuanPhan i agree – austingae Apr 30 '22 at 19:15

score 11 · Answer 3 · answered May 22 '21 at 13:42

11

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

answered May 22 '21 at 13:42

Gurjinder Singh

9,221
1
66
58

score 8 · Answer 4 · answered Oct 02 '19 at 08:03

8

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

answered Oct 02 '19 at 08:03

NYC Tech Engineer

1,845
2
22
23

Nice tip. Just checked and it is the same on Windows :) – zevij Jun 11 '23 at 03:46

José Velaides · Answer 5 · 2019-10-31T20:29:48.363

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

Go to Files > Preferences > Settings and search .json and click on settings.json file
or press SHIFT + CTRL + P and tab Preferences: Open Settings (JSON)
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.

score 2 · Answer 6 · edited Feb 19 '21 at 01:24

2

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"

edited Feb 19 '21 at 01:24

John Conde

217,595
99
455
496

answered Feb 18 '21 at 23:50

emlez

21
4

Note that it also works with `"liveServer.settings.CustomBrowser": "chromium",` on Linux, if Chromium is already started – roneo.org Oct 28 '21 at 21:47

score 1 · Answer 7 · answered May 21 '18 at 09:51

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

score 1 · Answer 8 · answered Jan 12 '19 at 08:14

1

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.

answered Jan 12 '19 at 08:14

walter

121
5

this solution in working to open application by default on chrome terminal. But can we do some setting in IDE itself? – Nishant Bhardwaz Jan 12 '19 at 08:23
In old version of VS code task configuration works but for newer version you have to install Open in Browser extension from the marketplace. [For Reference](https://stackoverflow.com/questions/47519768/how-do-i-set-the-default-browser-as-chrome-in-visual-studio-code) – walter Jan 12 '19 at 08:38

score 1 · Answer 9 · edited Mar 15 '21 at 01:53

1

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

edited Mar 15 '21 at 01:53

Sheraz

567
4
22

answered Mar 11 '21 at 20:51

Mhmd Saleh

11
1

score 1 · Answer 10 · answered Apr 08 '22 at 05:33

steps (change default browser for open with Live Server)

Go to File > Prefrences > Settings
Copy and paste liveServer.settings.CustomBrowser into the Search settings bar
Find the setting: Live Server › Settings: Custom Browser
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).

score 0 · Answer 11 · answered Mar 14 '18 at 23:48

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

score 0 · Answer 12 · answered Apr 17 '20 at 15:46

0

On Mac, via VS Code menu:

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

answered Apr 17 '20 at 15:46

Arta

5,127
5
25
23

score 0 · Answer 13 · edited Dec 17 '20 at 19:47

0

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

edited Dec 17 '20 at 19:47

Mohit Rathod

1,057
1
19
33

answered Dec 16 '20 at 19:35

adel

1

score 0 · Answer 14 · answered Jan 28 '21 at 20:52

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.

score 0 · Answer 15 · answered Jul 02 '23 at 09:52

0

Open live server in Google Chrome Canary [MacOS]

"liveServer.settings.AdvanceCustomBrowserCmdLine": "/Applications/Google Chrome Canary.app"

Past this line in setting.json in place of "liveServer.settings.CustomBrowser": "<-default browser->"

answered Jul 02 '23 at 09:52

Gambhir Sharma

21
4

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

15 Answers15

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

steps (change default browser for open with Live Server)

Linked

Related