Incluso el más experto de los lenguajes de programación se equivoca a la hora de programar. Por ello, los softwares de programación como Visual Studio Code han creado distintas herramientas que nos ayudan a mejorar nuestro código, evitar errores y personalizar nuestro entorno. En este post, te enseñaremos cómo configurar el archivo launch.json en JavaScript para mejorar tu experiencia con el debugger de VSC.
¿Qué es el archivo launch.json en JavaScript?
Antes de enseñarte cómo configurar el archivo launch.json en JavaScript, te aconsejamos leer nuestros posts sobre cómo funciona el debugger de JavaScript y qué es un archivo JSON. Leer estos dos contenidos te ayudará a saber cómo abrimos el debugger de JavaScript en Visual Studio Code y cómo exportamos su contenido a un archivo de texto .JSON.
El archivo launch.json que es, al igual que todos los archivos de tipo JSON en programación, es un archivo de texto que nos permite realizar ciertas funciones dentro de nuestro programa. La función más común de este tipo de archivos es configurar los parámetros de visualización de ciertas secciones a partir de los objetos JSON, similares a los objetos de JavaScript.
En particular, crear un archivo launch.json en el software de programación Visual Studio Code tiene la función de personalizar la forma en la que se ve el panel de depuración del debugger o Debug Console. Según el entorno que elijamos para este archivo, existirán ciertas configuraciones establecidas. Sin embargo, podemos agregar otras configuraciones para mejorar nuestra experiencia y hacer una depuración más avanzada junto al archivo launch.json.
¿Cómo configurar el archivo launch.json en JavaScript?
El archivo launch.json en JavaScript del entorno node.js tiene por defecto las siguientes configuraciones y comentarios:
{
// Use IntelliSense to learn about possible atributes.
// Hover to view descriptions of existing attributes.
// For more information, visit https://go.microsoft.com/fwlink/?linkid=830387
//configurar launch.json vscode
“version”:”0.2.0″,
“configurations”: [
{
“type”: “node”,
“request”: “launch”,
“name”: “Launch Program”,
“skipfiles”: [
“<node_internals>/**”
],
“program”:”${workspaceFolder]\\app.js”
}
]
}
De esta manera, has podido crear archivo JSON con JavaScript.Ten presente que, aunque puedes editar el texto de un archivo launch json o JSON, los atributos type, request y name son obligatorios para que funcione.
Para configurar el archivo launch.json en JavaScript, basta con agregar una propiedad en el comando clave:valor al objeto JSON del archivo. Recuerda que los objetos JSON son muy similares a los objetos JavaScript, pero se diferencian en que, tanto las claves como los valores, deben estar escritos entre comillas. Además, los objetos JSON no pueden tener nunca elementos de lógica, como cálculos y funciones.
Entonces, una manera en la que puedes configurar el archivo launch.json en JavaScript es con la opción outputCapture. Para insertarla, pon tu cursor en la última línea de código del objeto JSON antes del cierre de llave y escribe lo siguiente:
//launch.json debug
“outputCapture”: “std”
Esta opción hará que los textos en nuestro panel debug console, en vez de ser todos de color gris, tengan distintos colores y se vean más ordenados. Además, ejecutará el código en distintas líneas, haciéndolo más legible, y pintará en la pantalla el contenido de nuestros arrays.
Otros atributos que están disponibles para tu configuración son stopOnEntry, que nos permite hacer que el debugger se detenga inmediatamente cuando el programa se abra, y args, que nos permite insertar argumentos para que el programa depure. Si quieres conocer más sobre este archivo y sus opciones, te invitamos a leer el artículo de Visual Studio Code sobre la actividad debugging, que también se relaciona con crear archivo json con JavaScript y el objeto launch.json.
Ahora que sabes cómo configurar el archivo launch.json en JavaScript, te invitamos a seguir aprendiendo sobre las particularidades de este lenguaje de programación en nuestra formación intensiva sobre desarrollo web. En el Desarrollo Web Full Stack Bootcamp, no solo aprenderás a dominar el desarrollo de proyectos con JavaScript, sino también sobre otros lenguajes de programación ,como CSS y HTML. ¿A qué esperas para cumplir tu sueño de ser un desarrollador web? ¡No lo dudes más e inscríbete ya y aprende a configurar launch.json en vscode!
