00:00 / 00:00
Prettier + VSCode
No te ha pasado que te pones a picar código y se te van los tabs o te quedan unas funciones de una manera o de otra, o que cada miembro de tu equipo pica como le da la gana, o ya lo que es peor que hayan guerras santas de linter entre tabs vs espacios.
Para solucionar estos problemas tenemos Prettier, un formateador de código opinionado, es decir yo te digo como formateo y te dejas de tonterías.
Que ventajas tenemos haciendo esto, lo primero no te comes la cabeza con detalles, lo que hay es lo que hay, no te pongas a decir... oye esta regla de linter la ponemos o no... nada ahí tienes prettier, dejamos de tener discusiones fútiles, y el código de tu solución queda homogéneo, aunque no te guste como formatee prettier todo está igual y eso es muy importante.
Manos a la obra
Vamos a ver como instalar el plugin Prettier para Visual Studio Code y como hacer que formatee el código cuando grabemos cambios en nuestros ficheros.
Lo primero que vamos a hacer es instalar la extensión de Prettier, lo podemos hacer por línea de comandos, pero lo más cómodo es venirte a la pestaña de extensiones de VS Code, buscarlo e instalarlo.
Una vez que lo tenemos instalado vámonos ahora a Visual Studio Code y en las preferencias le damos a settings, en esta sección le indicamos que el formateador por defecto (Text Editor >> Default Formatter) va a ser Prettier (esbenp.prettier-vscode).
Lo siguiente que vamos a hacer es indicarle que aplique el formateo de prettier al grabar el documento, buscamos el setting Format on Save y marcamos el checkbox a true.
Con esto ya podemos ir a nuestro codigo fuente, desmontarlo un poco y al grabar podemos ver como Prettier lo formatea solo.
¿Te apuntas a nuestro máster?
Si te ha gustado este ejemplo y tienes ganas de aprender Front End guiado por un grupo de profesionales ¿Por qué no te apuntas a nuestro Máster Front End Online Lemoncode? Tenemos tanto edición de convocatoria con clases en vivo, como edición continua con mentorización, para que puedas ir a tu ritmo y aprender mucho.