SNIPPETS FOR VISUAL STUDIO CODE

Fuente: https://code.visualstudio.com/

LOS SNIPPETS

Según Microsoft Developer Network: 

"Un código de bloque re-utilizable que puedes insertar en tu código". 

Fragmentos de codigo que podemos reutilizar una y otra vez dentro los archivos de codigo de nuestra aplicacion.

FUNCIONAMIENTO

Estos fragmentos o porciones de código funcionan mientras estamos editando, escribimos el atajo y presionamos dos veces la tecla TAB, y por arte de magia aparecerá el fragmento de código completo.

CREAR UN SNIPPET PERSONALIZADO

Los fragmentos se definen en formato JSON y se almacenan en un archivo (languageId).json por usuario. Por ejemplo, los fragmentos de html van en un archivo html.json.

Requisistos:

1. NPM
2. Yeoman
3. Visual Studio Code Generator
4. Visual Studio Code Extension Manager

NPM

La instalación de NodeJS incluye con ello npm, por ello se recomienda instalar NodeJS.

enlace de descarga: https://nodejs.org/es/

para verificar la instalación correcta ejecutamos lo siguiente en la línea de comandos

verificar instalacion de Node: node -v

verificar instalación de npm: npm -v 

Yeoman

instalación: npm install -g yo

verificación:  yo doctor

 Visual Sudio Code Generator

Nos simplificará las tareas de creación de extensiones para visual studio code.

instalación: npm install -g generator-code

 Visual Studio Code Extension Manager

Se requiere para publicar y gestionar nuestra extensión para Visual Studio Code.

instalación: npm install -g vsce

Extension html

Para fines explicativos y a modo de ejemplo se creara una extension sencilla de html, mas adelante en otras publicaciones se explicará sobre futuras extensiones más complejas.

yo code

 Nos aparecerá la siguiente ventana donde nos irá pidiendo datos para nuestra extensión

Finalmente se nos crear la siguiente estructura de carpetas, y también en el archivo html.json podemos escribir todos nuestros fragmentos de código.