node.js - run - Abrir el navegador no predeterminado con el servidor lite en la guía de inicio rápido de angular2

run web server node js

Question

Después de haber seguido la versión de TypeScript de la guía de inicio rápido de Angular 2 , me preguntaba si es posible y, de ser así, cómo configurar el servidor lite para iniciar un navegador que no sea el predeterminado.

Parece que lite-server tomará yargs.argv línea de comandos, que se le yargs.argv través de yargs.argv . Y parece que yargs intentará analizar los yargs línea de comandos basándose en estándares bastante comunes (es decir, si un token comienza con un -- , representa un nombre de argumento, de lo contrario es un valor de argumento) para obtener argv . lite-server intentará usar la propiedad open que obtiene de argv , que es en última instancia, lo que inicia el navegador a través de [uno de los paquetes de nodo que inicia procesos]. nodo abierto? xdg -openar? No estoy seguro, no es tan importante para mí ahora, siempre y cuando mi suposición (basada en analizar varios de estos lanzadores de procesos) sea correcta, todos ellos optan opcionalmente por un argumento que defina el proceso de lanzamiento. Si se omite, el navegador predeterminado se usaría ya que el tipo de archivo para abrir es html, que es lo que sucede.

Si todo eso es correcto, o al menos lo esencial, entonces parece que solo necesito especificar --open chrome , por ejemplo (asumiendo que Chrome está en mi PATH - trabajando en una máquina de ganar por cierto), al final de la comando lite definido en package.json .

Así que algo como ...

"scripts": {
    "tsc": "tsc",
    "tsc:w": "tsc -w",
    "lite": "lite-server",
    "lite:c": "lite-server --open chrome",
    "lite:f": "lite-server --open firefox ",
    "start": "concurrent /"npm run tsc:w/" /"npm run lite/" "
},

Pido disculpas si esto parece inútil, pero no estaré en una computadora donde pueda probar esto por unos días, y necesito saber si tengo la respuesta y puedo dejar de investigar esto :). ¡Gracias!

Answer 1

Usando Debian / Ubuntu y update-alternatives

Pude confirmar que puede cambiar este proceso globalmente a través de este comando aquí . Actualmente, lite-server usa browser-sync que utiliza opn que incluye su propia copia de un xdg-open . Puedes configurarlo con,

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

Lo encontré preferible. Tiene efecto en todos los ejemplos de angular2 y también persiste en el resto del sistema operativo. También puede hacer que los enlaces se abran de incógnito (instrucciones en el enlace de arriba).

Answer 2

Cree un nombre de archivo "bs-config.json" en la carpeta de su proyecto y agregue el siguiente código a ese archivo:

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

Answer 3

Los cambios recientes (@ 2.1.0) le permiten configurar sus configuraciones, incluidos los navegadores, a través de bs-config.json :

{
  "browser": "chrome"
}

o

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

Si desea configurar scripts separados para cada brida, puede hacer lo siguiente en su 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"
  }
}

Si bien no es la mejor solución, ya que tiene que copiar y mantener su configuración en varios archivos, parece ser lo que pretende el mantenedor del servidor lite. Aquí está el archivo lite-server.js actual para referencia.

Answer 4

Para MacOS, tuve que usar el valor que distingue entre mayúsculas y minúsculas en el archivo "bs-config.json":

{
  "browser": "Google Chrome"
}

Answer 5

Para los principiantes de Windows (y Mac) (y no tanto): su primer impulso puede ser buscar ''bs-config.json'' dentro del directorio de su proyecto. No lo encontraras Debe crear un archivo en el directorio del proyecto raíz y denominarlo bs-config.json . Dentro de él, especifique el navegador de su preferencia, según la respuesta anterior -ie ,: {"browser": "chrome"}

La razón es que el archivo lite-server.js busca el archivo de configuración anterior; si no lo encuentra, utiliza los valores predeterminados de servidor lite, predeterminando Internet Explorer en los sistemas Windows.

Answer 6

lite-server realidad usa browser-sync , por lo que debería poder usar el --browser CLI --browser para eso.

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

Answer 7

ACTUALIZAR

El proyecto lite-server se ha actualizado para incorporar una selección de navegador configurable. Solo lo dejo para propósitos históricos, y apoyo la respuesta de Ender.

El creador de lite-server ha estado buscando resolver el problema de configurar todas browser-sync opciones de browser-sync alguna manera estándar (se .rc archivo .rc ). Por lo tanto, esta pregunta y respuesta pueden estar obsoletas cuando las lea.

Gracias Sasxa por señalar esto ...

lite-server realidad está usando el browser-sync ...

Esto fue fundamental para encontrar una solución para este problema en particular (es un poco vergonzoso que haya pasado por alto o que haya sido descartado ya que var sync = require(''browser-sync'').create(); sync.init() var sync = require(''browser-sync'').create(); ... sync.init() ).

Sin embargo, esa respuesta no funcionará como está porque esto ...

... por lo que debería ser capaz de usar el --browser CLI --browser para eso.

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

... no funciona fuera de la caja. Resulta que lite-server no está haciendo nada con el argumento del browser que yargs se utiliza para analizar. Casi había editado la respuesta de Sasxa, pero decidí que divergía demasiado, ya que realmente no se puede usar la CLI de browser-sync del browser-sync . lite-server ya está utilizando la API de browser-sync . En particular, se está llamando a init() , y la opción del browser debe estar especificada allí. Existe una desconexión completa entre el package.json la guía de inicio rápido de Angular 2 y browser-sync del browser con respecto a la línea de comando del browser arg.

La solución:

De modo inspirado en la respuesta de Sasxa, el argumento del browser pasará a yargs.argv , con chrome valor.

lite-server.js tendría que ser modificado para pasarlo a browser-sync . Esto se puede agregar como una propiedad en el objeto de options ...

var options =
  {
    openPath: openPath,
    files: argv.files ? argv.files : [
      openPath + ''/**/*.html'',
      openPath + ''/**/*.css'',
      openPath + ''/**/*.js''
    ],
    baseDir: argv.baseDir || ''./'',
    fallback: ''/'' + openPath + ''/index.html'',
    browser: argv.browser || "default" // add this line, ~line 24
  };

Luego, cuando se llama a init() -sync del browser , especifique la opción del browser .

sync.init({
  port: argv.port || 3000,
  server: {
    baseDir: options.baseDir,
    middleware: [
      log(),
      historyFallback({ index: options.fallback })
    ]
  },
  files: options.files,
  browser: options.browser // add this line, ~line 49
});

Ahora, volviendo al package.json inicio rápido de Angular package.json , se pueden usar los siguientes valores de argumento para el argumento del browser :

• chrome
• firefox
• iexplore

al igual que...

"scripts": {
    "tsc": "tsc",
    "tsc:w": "tsc -w",

    "lite": "lite-server",
    "lite:c": "lite-server --browser /"chrome/"",
    "lite:ff": "lite-server --browser /"firefox/"",
    "lite:ie": "lite-server --browser /"iexplore/"",
    "lite:garbage": "lite-server --browser /"garbage/"",

    "start": "concurrent /"npm run tsc:w/" /"npm run lite:c/" ",

    "//": "start default browser:",
    "//": "concurrent /"npm run tsc:w/" /"npm run lite/" ",
    "//": "start chrome:",
    "//": "concurrent /"npm run tsc:w/" /"npm run lite:c/" ",
    "//": "start firefox:",
    "//": "concurrent /"npm run tsc:w/" /"npm run lite:ff/" ",
    "//": "start ie:",
    "//": "concurrent /"npm run tsc:w/" /"npm run lite:ie/" ",
    "//": "if you want to see an invalid browser arg value, try...",
    "//": "concurrent /"npm run tsc:w/" /"npm run lite:garbage/" "
},

Algunos pensamientos finales

Es posible que deba usar "google chrome" como valor del browser para que Chrome se inicie realmente. Necesitaba usar "chrome" , mientras que los browser dicen "google chrome" ...

// Abrir el sitio en Chrome

browser: "google chrome"

// Abre el sitio en Chrome & Firefox

browser: ["google chrome", "firefox"]

El argumento de open línea de comandos está siendo utilizado por lite-server , como parte de la startPath que se pasa a browser-sync . browser parece canónicamente correcto para especificar el navegador que se desea iniciar, ya que, en última instancia, ese nombre lo utiliza en browser-sync . Además, en lo que respecta a esto, la respuesta de Sasxa fue incorrecta al suponer que --open local haría que browser-sync --open local ilesa. Eso realmente causará una ruta dañada, porque es consumida por lite-server y transformada en una ruta como /local/index.html , en lugar de /./index.html si no se especifica.