Opening non-default browser with lite-server in angular2 quick start guide

Question

Having followed the TypeScript version of the Angular 2 Quick Start guide, I was wondering if it is possible, and if so how to configure the lite-server to launch a browser othe

Answer 1

For MacOS, I had to use the case sensitive value in the "bs-config.json" file:

{
  "browser": "Google Chrome"
}

Answer 2

Make a file name "bs-config.json" in your project folder and add below code to that file:

{
"browser": ["chrome","firefox"]         //to make chrome to default browser
}

Answer 3

Using Debian/Ubuntu and update-alternatives

I was able to confirm that you can change this process globally through this command here. Currently lite-server uses browser-sync which uses opn which bundles its own copy of a xdg-open. You can configure this with,

sudo update-alternatives --config x-www-browser

I found it preferable. It takes effect on all angular2 examples, and persists for the rest of the OS too. You can also make the links open in incognito (instructions in the link above).

Answer 4

lite-server is actually using browser-sync, so you should be able to use --browser CLI command for that.

"lite:c" : "lite-server --browser chrome --open local"

Answer 5

Recent changes (@2.1.0) let you set your configs, including browser(s), via bs-config.json:

{
  "browser": "chrome"
}

or

{
  "browser": ["chrome","firefox"]
}

If you want to set up separate scripts for each broswer you can do the following in your package.json:

{
  "scripts": {
    "lite": "lite-server",
    "lite:ff": "lite-server --c bs-firefox.json",
    "lite:c": "lite-server --c bs-chrome.json",
    "lite:ie": "lite-server --c bs-ie.json",
    "lite:all": "lite-server --c bs-all.json"
  }
}

While it's not the best solution since you have to copy and maintain your config in multiple files, it seems to be what is intended by the lite-server maintainer. Here's the current lite-server.js file for reference.

Answer 6

For Windows (and Mac) newbies (and not so newbies :): Your first impulse may be to look for 'bs-config.json' within your project directory. You won't find it. You need to create a file under the root project directory and name it bs-config.json. Within it you specify the browser of your preference, per the above answer -i.e.,: {"browser": "chrome" }

The reason being is that file lite-server.js looks for the above config file; if it doesn't find it, it uses lite-server defaults, defaulting Internet Explorer on Windows systems.