Lo primero es tener VSCode y Live Server instalados y funcionando bien.
.
Luego lo que tienes que hacer para configurar VSCode y que al iniciar Live Server utilize un Navegador diferente al predeterminado es modificar el archivo JSON que contiene los settings.
Primero tienes que ir a File/Preferences y luego a Settings.
En la barra de búsqueda que aparece tienes que escribir live server lo que te mostrara todas las opciones disponibles.
Ahora puede hacer clic en Edit in settings.json que aparece debajo de Advance Custom Browser Cmd Line, como se muestra en la imagen.
.
.
.
"liveServer.settings.AdvanceCustomBrowserCmdLine": "Nombre del Navegador aqui",
.
"C:\\Program Files\\Google Chrome Dev\\chrome.exe"
.
La dirección depende de donde esta instalado el navegador deseado y tiene que ir con doble backSlash (\) para que funcione bien.
.
.
Tambien se puede usar la opción Custom Browser en los settings pero las opciones predefinidas son mas limitadas, por eso sugiero utilizar Advance Custom Browser.
Muchas gracias por el tutorial.
Realmente no sé por qué a mí no me funciona, recientemente he tomado el curso de Prework, ya había usado Live Server antes de descargar WSL, ahora que lo tengo instalado por alguna razón esa extensión me dejó de funcionar. En su defecto, sí inicia un servidor en el puerto que indica, pero no me abre automáticamente el navegador que configuro, con suerte me abre el que tengo por default. Sé que puedo copiar la dirección en la que está el Live Server y abrirla en el navegador que quiero, pero encuentro esa tarea un poco tediosa.
Mi solución fue usar una extensión cuya función es básicamente la misma: Five Server. No sé realmente qué es lo que pasa con la otra extensión, he intentado de todo.
Hola! Tuve el mismo problema, creo que fue una actualización de Windows que hizo que se desactivara. Puedes ir a extentions, seleccionarla y ver si te da un mensaje debajo del nombre que dice que se desactivó este Windows (o esta “Ventana”, está mal configurado el traductor automático) por no ser confiable. Le das click a ese mensaje y luego te da dos opciones, le das a “Trust”, te devuelves y revisas que en la barra de extensiones te aparezca Live Server como enabled y reinicias VS code.
a mi me funciona la extencion de manera correcta, pero algo que e notado y que realmente me resulta tedioso es que cada ves que quiero ver los cambios guardados en la pagina (por ejemplo) tengo que reiniciarla, a pesar de que e visto que a muchos se les actualiza automaticamente y en tiempo real a medida que va editando el codigo. ¿quisiera que me ayuden a resolver esto? me aerviria mucho.
gracias
Muchas gracias, perfecto.
Hola ya realice todos los pasos anteriores y aun asi sigo sin poder hacer que VSCode abra cualquiera de los navegadores (firefox, edge o chrome) que tengo instalado, simplemente no los abre y esto sucede tanto para Live Server como para PHP Server. Ojala alguien me pueda ayudar porque ya le di mil vueltas las configuraciones y no doy con la solucion.
hola. a mi no me funcionaba y puse esta linea y abajola que indican en el tutorial y ya me dio
"liveServer.settings.ChromeDebuggingAttachment":false,
Lo que puedes hacer es cambiar tu navegador predeterminado a google Chrome
Cuando hice el curso de Prework me funciono perfecto el Live Server, pero luego dejo de funcionar y no he podido hacerlo funcionar.
hola buen tutorial. pregunta: sabes como seria la ruta del navegador para linux?
Gracias por el aporte me funciono muy bien
Gracias por la info! me funcionó agregando la ruta del .exe
Yo tengo un problema fuerte con LiveServer y el uso de Workspaces en MSEdge.
Cuando configuro para que los cambios que hago en DevTools de Edge se guarden directamente en el disco. Liveserver detecta directamente esos cambios y recarga la página. (Claro esa es su función) Pero el problema es que si hago los cambios en el DevTools, no alcanza a escribir el cambio. Lo que hace que se rompa el CSS.
He buscado de todo para poderlo configurar y no encuentro nada.