Configuración de Visual Studio Code

¿Cómo cambiar la configuración de Visual Studio Code? ¿Cuáles son los más importantes? ¿Hay un archivo de referencia en el sistema?

Cuando posees una herramienta de software de cualquier tipo, es importante calibrarla con la configuración correcta, para obtener un entorno cómodo que no genere molestias innecesarias en las operaciones más simples.

Ni siquiera Visual Studio Code escapa a esta lógica y presenta diversas opciones para obtener configuraciones personalizadas.

Configuración de preferencias en Visual Studio Code

Se puede acceder fácilmente a la configuración de Visual Studio Code a través de la barra de menú del software (“Archivo > Preferencias > Configuración” o “Archivo > Preferencias > Configuración”).

Alternativamente, es posible operar a través del panel lateral: símbolo de la rueda en la parte inferior y luego “Configuración” o “Configuración”.

Otro método para acceder rápidamente a la configuración es usar la combinación de teclado CTRL+, .

La interfaz

La interfaz que se nos presenta es bastante sencilla, tenemos una barra de búsqueda en la parte superior, dos pestañas debajo, un panel lateral con una lista con viñetas y en el área central los diversos elementos que se pueden modificar.

Todo este contenido se muestra como una pestaña en el editor de archivos, similar a un archivo para editar.

La barra de búsqueda

La barra de búsqueda produce resultados instantáneos, no es necesario presionar la tecla Intro u otros botones para ver una búsqueda.

Cada vez que finaliza la búsqueda, a la derecha verás el número de resultados encontrados y dos íconos, uno con muchas líneas horizontales y el otro con un embudo.

Al presionar el ícono con las líneas horizontales, se eliminará el contenido actual de la barra de búsqueda, los resultados también volverán al estado global.

Más interesante es el icono del embudo, que nos permite filtrar aún más el resultado indicando si:

  • Queremos buscar solo entre configuraciones ya modificadas (“Modificado” o “Modificado”).
  • Queremos buscar entradas para una extensión específica (“ID de extensión” o “ID de extensión”).
  • Queremos buscar en las entradas una característica específica del editor (“Característica” o “Característica”).
  • Queremos buscar elementos de configuración que tengan una etiqueta específica (“Etiqueta”).
  • Queremos buscar en los elementos de configuración un lenguaje de programación específico (“Idioma” o “Idioma”).
  • Queremos buscar elementos de configuración que tengan opciones en línea (“Servicios en línea”), este filtro en particular se reduce a filtrar una etiqueta específica.

A excepción del primer y último filtro, los demás abrirán un menú adicional para seleccionar el valor que se aplicará al filtro.

Esto hará que su búsqueda sea aún más fácil.

Activar la sincronización de ajustes

Una cosa que no se mencionó intencionalmente anteriormente es la entrada que dice “Activar sincronización de configuración” a la derecha, justo debajo de la barra de búsqueda.

Visual Studio Code le permite utilizar un servicio que sincroniza los datos del editor entre varios dispositivos . Sin embargo, hablaremos sobre esta función más adelante, simplemente ignórela por ahora.

Configuración del espacio de trabajo y del usuario

El primer detalle importante que no debemos pasar por alto es la opción que nos ofrece el editor debajo de la barra de búsqueda. Es decir, esas dos pestañas llamadas “Usuario” y “Área de trabajo” (“Usuario” y “Área de trabajo” en la versión italiana).

De hecho, es posible tener configuraciones que se apliquen al proyecto actual (haciendo clic en “Área de trabajo” o “Área de trabajo”) o que afecten a todas las instancias de Visual Studio Code que abrirá con su usuario (haciendo clic en “Usuario” o “Usuario”).

La configuración del espacio de trabajo tiene mayor prioridad que la configuración del usuario. Esto significa que si se especifica una determinada entrada tanto en el espacio de trabajo como en la configuración del usuario, esta última se ignorará.

¿Cómo cambiar ajustes?

Para cambiar uno de los valores, simplemente usa los menús desplegables propuestos por el editor o uno de los campos de texto.

Al finalizar los cambios, recuerde guardar el trabajo realizado (desde la barra de menú “Archivo > Guardar” o presionando CTRL+s ).

El panel lateral

Una función muy conveniente es la que ejerce el panel lateral, donde encontrará una lista con viñetas de secciones insertadas en un “árbol”.

En la lista se pueden observar varios elementos que al hacer clic en ellos, notarás que la interfaz se mueve a una sección específica de la configuración.

Configuraciones de las extensiones

El panel lateral es particularmente útil para explorar directamente los elementos del menú de una extensión instalada específica.

Algunas extensiones también podrían dar acceso a sublistas específicas con secciones anidadas, reduciendo drásticamente los tiempos de búsqueda del elemento que queremos modificar.

El archivo de configuración

Detrás de escena, las diversas entradas se leen y escriben a través de un archivo JSON , llamado settings.json .

Aunque no estés acostumbrado a esta tipología, la estructura será relativamente sencilla y verás cada línea escrita de la siguiente manera:

{
"nombre del ajuste":"valor",
"otra configuración" :"valor"
}

Los nombres de las configuraciones van entre comillas dobles, seguidas por el carácter de dos puntos y luego el valor que queremos para esa opción, siempre se usan comillas dobles si son combinaciones alfanuméricas (con la excepción de números y valores booleanos, es decir, true y false )

Por ejemplo, algunas entradas son:

"editor.guides.bracketPairs": "active"

o

"git.closeDiffOnOperation": true

Como puedes ver, en los distintos nombres encontramos caracteres de ‘punto‘ que sirven para categorizar qué vamos a cambiar y dónde.

En el caso de las extensiones esta subdivisión es particularmente útil, de hecho la primera parte debería tomar su nombre. Por ejemplo:

"powermode.enabled": true

¿Cómo escribir un valor?

En cuanto a los posibles valores que puedes asignar a una opción específica, Visual Studio Code te ofrece sugerencias a través de un menú desplegable, las sugerencias se vuelve cada vez más preciso a medida que escribes.

Puedes moverte verticalmente entre los distintos elementos usando las teclas de flecha de tu teclado y hacer clic en Intro cuando encuentres el que te gusta.

Si la pista desaparece debido a tu error, no te preocupes, solo presiona la combinación CTRL + BARRA ESPACIADORA .

La ubicación del archivo

La posición del archivo, por otro lado, puede ser variable. De hecho cambia si queremos modificar solo la configuración del usuario o del proyecto.

Sin embargo, puedes acceder a él desde Visual Studio Code usando el botón que aparece arriba a la derecha con un archivo dibujado y una flecha curvada.

Evidentemente si lo pulsamos cuando estamos en la pestaña de “Usuario” abriremos los ajustes de usuario, en caso contrario los del proyecto.

El archivo de configuración del usuario

La ubicación de la configuración del usuario, a su vez, varía según el sistema operativo:

  • en Windows busca el archivo en la carpeta APPDATA , la ruta exacta sería C:\Users\NOMBREUSUARIO\AppData\Code\User\settings.json .
  • en Linux busca el archivo en la carpeta de HOME abajo .config , la ruta exacta sería /home/nombreusuario/.config/Code/User/settings.json .
  • en macOS busca el archivo en la carpeta de Library abajo Soporte de Aplicación , la ruta exacta sería /Users/nombreusuario/Librería/Soporte de Aplicación/Code/NombreUsuario/settings.json .

El archivo de configuración por proyecto

El archivo del proyecto se encuentra, si existe, en la carpeta .vscode de dentro de la carpeta abierta en Visual Studio Code y siempre se denomina settings.json .

Sin embargo, si aún no se ha escrito ninguna configuración en el espacio de trabajo actual, es probable que el archivo y la carpeta no existan y debas crearlos.

Puedes hacerlo manualmente o anulando al menos una entrada de la GUI a través del mismo Visual Studio Code.

¿Cómo restablecer la configuración?

¿Ha cambiado una configuración y ahora quieres volver atrás, pero no puedes recordar cuál era el valor predeterminado?

Simplemente haz clic en la rueda que aparece a la izquierda de cada extensión para que aparezca una ventana emergente con el elemento de “Reiniciar Configuración”.

Si realmente deseas volver al estado original de todo el editor de texto o IDE de Visual Studio Code, puedes eliminar el contenido del archivo settings.json manualmente.

📖 GUÍA COMPLETA DE VISUAL STUDIO CODE

Relacionado

40 Cursos Gratis de Udemy: Desarrollo Web, Python (cupón finalizado)

Recién llega la primavera y vamos con una publicación más, que incluye los cursos del Lunes; hoy tenemos, 9 cursos en español (Typescript, Javascript, React, Vue, Firebase, Swift, Azure, HTML y CSS, Power Bi). Más 31 cursos en inglés: Javascript, Typescript, React, Python, R, Java, Drupal, Android y Kotlin, Básicos de Visual Studio Code, Bootstrap, Gitlab, Maya 3D, Photoshop, Marketing en Facebook e Instagram, SEO. Iniciación ¡SEGUIR LEYENDO!

Segunda actualización de Java para Visual Studio Code en 2020

En esta actualización, le mostraremos las nuevas formas de administrar sus dependencias y configurar el JDK múltiple. Aprender las herramientas adicionales que se pueden aprovechar para utilizar frameworks y mejorar los tiempos de ejecución. Además, existen algunos cambios más dentro de esta actualización. Gestión de dependencias Ya sea que use o no una herramienta de compilación, Java Dependency Viewer ahora proporciona una manera mejor de manejar ¡SEGUIR LEYENDO!

Extensión de Adobe XD para Visual Studio Code: Crea y revisualiza paquetes de sistemas de diseño

Una nueva e impresionante extensión de Adobe XD para Visual Studio Code, nos permite utilizar Adobe XD sin salir del editor. Los sistemas de diseño son el vínculo entre diseño y el desarrollo. Para construir un sistema exitoso, personalizado y ampliamente adoptado, tanto los diseñadores como los desarrolladores deben tener un hueco a la hora de la creación. La nueva extensión de Adobe XD para Visual ¡SEGUIR LEYENDO!

5 Mejores Alternativas de Visual Studio Code para Linux en 2024

¡Editores de código interesantes que podrían reemplazar a Visual Studio Code en 2024! Aquí te traigo algunos nuevos editores de código destacables que se lanzaron para Linux, como por ejemplo Lite XL hasta otras opciones como Pulsar. 5 Alternativas al editor de código Visual Studio Code Comencemos, he compilado esta lista de los próximos editores de código para Linux que tienen una gran capacidad y aspiraciones ¡SEGUIR LEYENDO!

23 Mejores Cursos Gratis de Editores de Texto

Los mejores cursos gratuitos para aprender a utilizar como un auténtico profesional los mejores editores de texto. Con estos cursos, vas a conocer los mejores trucos, plugins, extensiones y flujos de trabajo con los que optimizar tu trabajo sobre algunos de los editores de texto más utilizados del mundo. Mejores Editores / Editores Python / Editores Java / Editores Markdown Los Mejores Cursos de Editores de ¡SEGUIR LEYENDO!

Cursos de Programación gratuitos de Youtube 2022 (Mayo)

Aprende sobre Inteligencia Artificial VER EN YOUTUBE por DotCSV Curso .Net 6 VER EN YOUTUBE por The Coder Cave Curso Angular VER EN YOUTUBE por Píldoras Informáticas (actualizado) Curso App Inventor VER EN YOUTUBE por Programador Novato Curso Arduino VER EN YOUTUBE por Programador Novato Curso C# VER EN YOUTUBE por Píldoras Informáticas (actualizado) Curso CSS3 desde cero VER EN YOUTUBE por AlexCG Design (actualizado) Curso ¡SEGUIR LEYENDO!

Mejores extensiones de Visual Studio Code para Desarrolladores Web

El uso de extensiones que se pueden instalar directamente en el editor de Visual Studio Code es cada día mayor. Aquí tienes algunas de las más útiles extensiones de Visual Studio Code para aplicar en tus proyectos de desarrollo web. Actualmente, Visual Studio Code es el editor de código más popular entre los desarrolladores. Visual Studio Code incluye muchas características interesantes que pueden ayudarte a mejorar ¡SEGUIR LEYENDO!