Acceder al contenido principal

Blog

Volver a Blog

Cómo compilar less con koala app

03 Ene 018
Koala App
Avatar Fernando González

Diseño

Hola chicos, antes de nada, Feliz año nuevo, espero que tengáis un fantástico 2018. hoy os enseñare en un pequeño tutorial cómo podemos compilar less con koala - app

Koala es una app disponible para todos los SO actuales, es una aplicación gráfica, que nos permite compilar archivos sass y less de forma rápida. Con características como que nos compile automáticamente, cuando detecte cambios en los archivos fuentes, también que nos minifique el código, y para ver cómo lo hacemos os traigo este post.

 

Lo primero es que os descarguéis e instaléis koala, os dejo aquí el link: http://koala-app.com/

una vez instalada la app y abierta, arrastramos o abrimos una carpeta de un proyecto en el cual estarán los archivos .less dando al botón de +.

Koala app

 

 

Tras ésto nos aparece a la izquierda nuestra carpeta del proyecto y dentro los archivos less o sass que encuentra dentro

Koala app proyecto less

 

Si damos click derecho podemos ver las opciones para configurar dónde se hará la salida del archivo procesado y compilado.

Seleccionaremos la carpeta indicada para dejar alli nuestros css hechos o la crearemos y la configuramos en koala.

 

Koala app ruta de salidaKoala ruta de salidaKoala nombre de archivo

 

Una vez configurada la ruta de salida, y el nombre de nuestro archivo de salida, damos un click izquierdo sobre el archivo less o sass a compilar, nos aparecen unas opciones a la derecha que podemos configurar como queramos. Las más importantes son, la compilación automática y el estilo de salida, con la compilación automática, en cuanto koala detecte que se ha grabado, y se ha modificado el/los archivos fuentes less o sass, autoáticamente, genera la salida del archivo compilado de nuevo, sobreescribiendo el antiguo en caso de existir. Con la opción estilo de salida, le indicamos si queremos que la salida sea normal, o comprimida, la diferencia no solo es la legibilidad que puede tener nuestro css, sino también, el tamaño del archivo, así comprimida, los saltos de línea, comentarios y espacios, no estarán y ocupa menos, y nuestra página web será un poco más rápida, hablando de archivos con varias líneas, claro.

Luego podemos dar a compilar o simplemente guardar nuestro archivo fuente less o sass e ir a la carpeta donde se guarda la salida css.

Koala salida

 

Y esto es todo chicos, espero que os ayude, un saludo!!!

Comentarios

Añadir nuevo comentario