VSCode: Trabajar con archivos eficientemente.



En este artículo te mostraré los trucos y consejos que uso para trabajar más rápido con archivos en Visual Studio Code, aprenderás a encontrar más rápido los archivos dentro de tu proyecto, como crear archivos nuevos, buscar funciones dentro de los archivos de código, etc.

Nota: Para que funcionen algunas cosas en PHP necesitas tener instalada la extensión PHP Intelephense.

Estos son los temas que veremos:

Como buscar un archivo.

Esto te ahorrará mucho tiempo, cuando estás programando necesitas abrir archivos constantemente y usualmente solo recuerdas parte del nombre del archivo que necesitas abrir.

Muchas personas lo que hacen es navegar por el árbol de archivos y carpetas que esta a la derecha, pero la forma más fácil es presionando las teclas Ctrl + p con esto se abrirá una pequeña ventana y ahora solamente tienes que escribir parte del nombre del archivo y si la primera opción que se muestra, es la que buscas, entonces solamente presionas la tecla Enter y VSCode abrirá el archivo.

Buscar archivos en VSCode

Si la opción que necesitas es la segunda u otra más abajo, entonces solo presionas la tecla de flecha abajo hasta que llegues a la opción que necesitas y presionas la tecla Enter.

Como buscar entre los archivos abiertos.

Cuando estás programando, usualmente tienes varios archivos abiertos con los que estás trabajando y necesitas estar consultando o modificando esos archivos. Una forma de cambiar de archivo es dando clic sobre la pestaña, pero si hay muchos abiertos, eso se hace imposible.

Lo que puedes hacer es presionar la tecla Ctrl y mantenerla presionada, luego presionas la tecla Tab (sin soltar la tecla Ctrl), esto abrirá una ventana con todas los archivos que tienes abiertos y cada vez que presiones la tecla Tab te moverás al siguiente archivo en la lista, cuando estés sobre el archivo que deseas abrir entonces solo debes soltar la tecla Ctrl.

VSCode, buscar entre los archivos abiertos

Uso del Breadcrumb

Cuando abres un archivo puedes ver esta sección, eso se llama Breadcrumb y muestra la ruta del archivo.

VSCode Breadcrumb

Pero lo interesante de esta sección es que puedes navegar entre los métodos y funciones del archivo, de esta forma puedes ir directo a la función que necesitas, aun si no recuerdas su nombre exacto.

También puedes navegar sobre una carpeta, por ejemplo, si estás trabajando con un archivo y quieres abrir otro archivo que sabes que está dentro de la misma carpeta, entonces solo tienes que hacer clic sobre el signo > que esta después del nombre del archivo y verás una lista de todos los archivos dentro de esa carpeta.

Navegar por la carpeta de un archivo abierto, VSCode

Como encontrar y abrir el archivo que contiene la función que necesitas consultar.

En algunos casos necesito modificar una función (o método de una clase) y recuerdo parte del nombre, pero no recuerdo en que archivo está. En esos casos solo presiono las teclas Ctrl + t con esto se abrirá una ventana que nos permite buscar funciones o incluso variables, solo debes escribir parte del nombre y luego selecciona una opción de la lista que se muestra y VSCode abrirá el archivo que contiene la función.

Ir a la definición de una función.

En ocasiones uso alguna función y veo que tiene un error, entonces necesito hacer las correcciones necesarias. La forma más fácil de llegar al archivo que contiene la función es presionando la tecla Ctrl y luego haciendo clic sobre la función, esto hará que VSCode abra el archivo que la contiene y se ubique en la línea en donde está definida.

Esto funcionará bien dependiendo de si VSCode entiende como está organizado tu código, pero si usas un framework como Laravel, no tendrás ningún problema.

Extensiones para crear y trabajar con archivos

Para los siguientes consejos vamos a necesitar algunas extensiones, estas son: advanced-new-file y File utils, te recomiendo que las instales porque pueden ahorrarte algo de tiempo mientras trabajas.

Extensiones en VSCode

Si nunca antes has instalado una extensión o plugin, solo debes hacer clic en el icono de extensiones, luego borras el texto que aparece y digitas el nombre de la extensión que deseas. Cuando la encuentras solamente haces clic el botón que dice Instalar y que está junto a la extensión que deseas.

Instalar extensiones en VSCode

Crear archivos más rápido.

Esto está incluido en la extensión advanced-new-file, para crear un nuevo archivo solo presionas las teclas Ctrl + Alt + n ahora en la ventana que se abre debes seleccionar la carpeta en donde quieres guardarlo, puedes escribir parte del nombre y luego seleccionar la carpeta que deseas.

Seleccionar carpeta para crear un archivo en VSCode

Ahora escribes el nombre del archivo que deseas crear y listo, ya tienes el archivo creado en la ruta que necesitas.

Nombre del archivo a crear en VSCode

Duplicar un archivo más rápido.

Esta parte esta incluida en la extensión File utils, si ya tienes un archivo y sabes que vas a reutilizar una parte de este, la forma más fácil de duplicarlo es presionando las teclas Ctrl + Shift + p y en la ventana escribes duplicate o parte de esa palabra y selecciones la opción File utils: Duplicate. Esto va a duplicar el archivo que tengas abierto.

Duplicar archivos en VSCode

Ahora solo escribes el nombre del archivo duplicado y presionas la tecla Enter.

Ahora se coloca el nombre con el que se va a duplicar el archivo

Conclusiones

Estas son las herramientas que VSCode brinda para trabajar con archivos y son las que me facilitan más mi trabajo, espero que te sirvan también a ti. Me gustaría que dejaras un comentario diciendo cuál te gusto más o mejor aún, si tienes alguna que no mencione y quieres compartirla me encantaría que lo hicieras.

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

1 Comment

  1. Avatar de Roberto Villatoro

    Existe alguna extensión o forma similar a la de presionar control para abrir funciones, clases o métodos de forma rápida, pero para archivos? Por ejemplo, si tengo un formulario y quiero abrir el action que está en él de forma rápida o si tengo una URL y necesito editar el código de ese destino.