Ahorra código utilizando snippets

En este post me gustaría mostraros como funciona el sistema de snippets (o lo que es lo mismo trozos de código) que posee ST2, así de esta manera os podréis ir manejando vosotros mismos y creándoos los vuestros propios dependiendo de las necesidades de cada uno, de esta manera realizar las tareas más repetitivas en un abrir y cerrar de ojos.

 Para empezar, en el propio repositorio de ST2 existen cantidad de paquetes que contienen snippets, como por ejemplo "Additional PHP Snippets" para PHP o "CSS Snippets" para códigos CSS. Existen muchos más para cualquier tipo de lenguaje, pero si aún así teneis trozos de código que queréis que se puedan reutilizar, vamos a ver cómo se puede hacer.

En primer lugar abriremos nuestro ST2 y nos iremos a la opción de menú Tools > New Snippet... y allí nos saldrá una plantilla como la siguiente:

        
        
        hello
        
        source.python
        
    

Como podeis observar se trata como un fichero XML en el cual se pueden observar las etiquetas siguientes:

• Snippet: Esta etiqueta es la que nos indica todo el contenido de nuestro código.
• Content: Dentro colocaremos nuestro trozo de código que queremos emplear, hay que acordarse siempre que debe estar entre los corchetes de la sentencia siguiente.
• tabTrigger: Con esto le indicamos a ST2 cuando busquemos en nuestra paleta, apretando Ctrl + Shift + P o Cmd + Shift + P qué palabra es la identificativa de nuestro snippet.
• Scope:Otra de las cosas importantes es en qué ámbito queremos que nos los muestre, es decir, si le indicamos para qué lenguaje queremos que funcione. Por ejemplo, si tengo un código PHP no hace falta que si yo abro un archivo CSS y quiero utilizar los snippets me filtre el que yo he creado, porque solo me hace falta cuando abra un archivo PHP, entonces deberé poner source.php como scope.
• Description: Descripción de nuestro snippet.

Todos los snippets tienen como extensión .sublime-snippet. Para no perderlos, su almacenamiento deberá encontrarse dentro de la carpeta Users de nuestro ST2. En esa carpeta nos podremos organizar como nosotros queramos, inclusive generando subcarpetas para nuestra mejor organización, ya que el programa lo detectará automáticamente.

Campos

Siguiendo el ejemplo, vemos que dentro del contenido se ven como una especie de variables "$1", "$2", etc. y así todas las que necesitemos. A este tipo de elementos se les denomina campos y sirven para ir rellenando el código una vez insertado. Una vez seleccionado nuestro snippet, el cursor se colocará en el espacio donde se encuentre $1 y conforme se le vaya dando a la tecla Tab iremos saltando al siguiente campo.

También se pueden reutilizar campos, si por ejemplo colocamos el campo $1 en varios sitios, cuando se empiece a rellenar el primero, lo harán a la vez el resto de campos iguales que hayamos colocado.

Cuando se ve a uno de los campos con la siguiente sintaxis ${2:snippet} significa que en "$2" el valor por defecto es "snippet" si no lo rellenamos se colocará automáticamente.

Variables de entorno

De la misma manera, existen otro tipo de variables, denominadas variables de entorno. Este tipo de variable se encuentran a nivel de programa del cual podemos sacar información:

• $SELECTION: Texto seleccionado en el momento de insertar la plantilla.
• $TM_CURRENT_LINE Contenido de la línea del cursor en el momento de insertar la plantilla.
• $TM_CURRENT_WORD Palabra bajo el cursor en el momento de insertar la plantilla.
• $TM_FILENAME Nombre del archivo activo con su extensión.
• $TM_FILEPATH Ruta al archivo activo.
• $TM_FULLNAME Nombre de usuario del usuario.
• $TM_LINE_INDEX Columna donde se produce la inserción de la plantilla (se empieza en 0).
• $TM_LINE_NUMBER Fila donde se produce la inserción de la plantilla (se empieza en 1).
• $TM_SELECTED_TEXT Un alias de $SELECTION.
• $TM_SOFT_TABS YES si translate_tabs_to_spaces es true, o NO en caso contrario.
• $TM_TAB_SIZE Espacios por tabulador (valor especificado en la opción tab_size).

Espero que este post os haya servido de ayuda.