Share
El mundo del desarrollo web de front-end ha ido aumentando constantemente su aceptación de lo que llamamos "Preprocesadores CSS", que extienden la funcionalidad de CSS regular. Podría decirse que los dos más conocidos, con la mayor base de usuarios, son MENOS y Sass / SCSS. Sin embargo, hay un tercer preprocesador que no ha recibido tanta atención, y eso es Stylus.
Hoy discutiremos por qué Stylus es increíble, por qué lo elegí y por qué podría convertirse en tu nuevo héroe de CSS.
Antes de entrar en los detalles específicos de cómo funciona Stylus, voy a comenzar con mi propia versión de las fortalezas predominantes de LESS y Sass / SCSS, y por qué no elijo ninguno de los dos, aunque ambos son buenos..
Cada uno de los tres preprocesadores incluye el uso de variables, combinaciones, anidamiento y extensión, junto con diversos grados de operaciones y funciones lógicas. Por lo tanto, los tres son iguales, ya que le permiten abstraer elementos de diseño clave, usar lógica y escribir menos código, lo que hace que todos ellos puedan proporcionarle grandes ganancias sobre CSS sin formato cuando se usan bien.
Sin embargo, dado que los tres son iguales en este sentido básico, son las formas en que son diferentes las que en última instancia llevarán a su elección sobre cuál usar..
Para mí, la mayor fortaleza fuera de los aspectos comunes a los tres preprocesadores es la comunidad alrededor de MENOS y las ofertas creadas por ellos..
El proyecto más conocido que incorpora LESS es el marco de Twitter Bootstrap, y creo que el deseo de trabajar con él es una parte importante de lo que lleva a muchas personas a LESS.
Otro destaque es la biblioteca LESShat mixin, que proporciona una excelente variedad de mixins para efectos CSS3 y más, y su socio CSShat plugin para Photoshop, que genera copiar y pegar código LESS a partir de elementos PSD. En particular, estos dos elementos en tándem crean un flujo de trabajo muy poderoso que es fantástico si realiza gran parte de su proceso de diseño dentro de Photoshop.
Y una gran ventaja más para MENOS es el hecho de que la mayoría de las personas les resulta bastante accesible de usar. Puede usar un archivo JavaScript simple para compilarlo sobre la marcha, puede usar un IDE con compilación incorporada como CrunchApp (o CodeKit solo en Mac), o puede usar Node.js en su máquina local para una más robusta / solución de compilación flexible.
Siempre prefiero mi propio código a los marcos de terceros, y también tiendo a hacer un diseño de Photoshop mínimo en estos días, prefiriendo diseñar dinámicamente en el navegador tanto como sea posible. (CSSHat puede salir en múltiples idiomas también). Así que, para mí, por muy buenos que sean los proyectos que describí, no son suficientes para obligarme a elegir MENOS como mi preprocesador..
Pero la principal razón por la que no uso LESS es en realidad el abismo significativo en las funciones de procesamiento lógico disponibles entre este y los otros dos preprocesadores principales..
Desafortunadamente, cuantas menos funciones lógicas estén disponibles para el uso, menos podremos crear un código mínimo y limpio, y el desarrollo más lento y la posterior modificación serán.
LESS sí permite algo de lógica, pero en realidad es bastante limitante en comparación con Stylus y Sass / SCSS. Verás por qué en mi descripción de lo que es asombroso de Sass..
Sass también tiene una gran comunidad con muchos grandes proyectos disponibles para usar. Donde LESS tiene Twitter Bootstrap, Sass tiene marcos como Gumby y Foundation. Donde LESS tiene LESShat, Sass tiene bibliotecas mixtas como Compass y Bourbon.
Sin embargo, donde realmente se compara con LESS es su poderosa capacidad para manejar la lógica. Donde LESS es lo que podríamos llamar CSS mejorado, Sass se comporta mucho más como un lenguaje de programación completo.
Por ejemplo, Sass le permite crear cheques condicionales escritos de manera eficiente, lo cual es particularmente útil dentro de los mixins.
En Sass puedes hacer lo siguiente:
@mixin border_and_bg ($ border_on, $ border_color, $ bg_on, $ bg_color) @if $ border_on == true border: 1px solid $ border_color; @else border: 0; @if $ bg_on == true background-color: $ bg_color; @else color de fondo: transparente;
Esta mezcla revisa para ver si $ border_on se establece en cierto, y si es así usa el $ border_color valor en la salida para el frontera propiedad. Si no, recae en la configuración de la frontera propiedad a 0.
A continuación, también comprueba si $ bg_on se establece en cierto, y si es así usa el $ bg_color valor en la salida para el color de fondo propiedad. Si no, establece el color de fondo propiedad a transparente
Esto significa que, dependiendo de los valores pasados, se pueden generar hasta cuatro tipos diferentes de salida a partir de una sola mezcla, es decir, el borde y el fondo tanto en el borde como el fondo, el borde activado y el fondo desactivados, el borde desactivado y el fondo activado.
Sin embargo, en MENOS no hay comprobaciones de "si / si", por lo que lo anterior no sería posible. Lo más que puede hacer con LESS es usar lo que se denomina "Mixin guardado", donde un mixin dado se emite de forma diferente en función de una verificación contra una sola expresión.
Así que tu mezcla podría comprobar si la @Bordear el parámetro se estableció en cierto al igual que:
.border_and_bg (@border_on, @border_color, @bg_on, @bg_color) cuando (@border_on = true) border: 1px solid @border_color;
Sin embargo, debido a que falta la funcionalidad "if / else", tampoco tiene la capacidad de verificar posteriormente el valor de @bg_on, ni para dar un valor alternativo a la frontera propiedad dentro del mismo mixin.
Para lograr la misma lógica que se manejó con una sola mezcla de Sass, necesitaría crear cuatro diferentes mezclas protegidas con MENOS, es decir, una para cada una de las posibles combinaciones de @Bordear y @bg_on valores, como asi:
.border_and_bg (@border_on, @border_color, @bg_on, @bg_color) cuando (@border_on = true) y (@bg_on = true) border: 1px solid $ border_color; color de fondo: @bg_color; .border_and_bg (@border_on, @border_color, @bg_on, @bg_color) cuando (@border_on = falso) y (@bg_on = falso) border: 0; color de fondo: transparente; .border_and_bg (@border_on, @border_color, @bg_on, @bg_color) cuando (@border_on = false) y (@bg_on = true) border: 0; color de fondo: @bg_color; .border_and_bg (@border_on, @border_color, @bg_on, @bg_color) cuando (@border_on = true) y (@bg_on = false) border: 1px solid @border_color; color de fondo: transparente;
Y eso es solo con dos valores para verificar; el número aumenta con cada valor en el que desea ejecutar la lógica, lo que puede volverse muy difícil de manejar, ya que desea crear combinaciones más sofisticadas. También es un proceso arduo considerar todas las permutaciones posibles de las combinaciones de variables para dar cuenta de todas ellas..
Ese es solo un ejemplo de donde la lógica mejorada hace la vida mucho más fácil con Sass vs. LESS, pero hay muchos más. Cabe destacar que Sass también ofrece excelentes habilidades de iteración a través de su @para, @cada y @mientras directivas.
Y finalmente, muy importante, mientras que LESS tiene algunas funciones integradas excelentes, Sass hace que sea muy fácil escribir las suyas. Simplemente se escriben como:
@function nombre-función ($ parámetro) @return $ dosomething + $ parámetro / $ somethingelse;
Estas funciones lógicas abren un mundo de posibilidades para cosas como crear sus propios motores de diseño, manejo de px a em, modificadores de color y accesos directos para una cantidad infinita de cosas que puede necesitar de proyecto en proyecto..
Por todo lo que he leído y escuchado sobre las personas que conversan, y desde mi propia experiencia, es este poder lógico enormemente mejorado el principal impulsor de las personas que eligen Sass en lugar de MENOS.
Con LESS descartado para la mayoría de los proyectos debido a sus operaciones lógicas limitadas, se trata de una opción entre Sass y Stylus, ambos con una gran variedad de funciones disponibles.
Y entre los dos, elijo Stylus. Stylus tiene el poder de Sass, con la accesibilidad de MENOS.
Stylus.js hace todo lo que necesito que Sass haga, pero solo requiere JavaScript o Node.js para compilar. Además, tiene una manera particular de operar que es suave y fácil de trabajar, y tiene una hermosa sintaxis limpia que prefiero.
Para mí, el requisito de ejecutar Ruby on Rails y lidiar con gemas es un obstáculo importante para querer trabajar con Sass. Ruby no es parte de ninguno de los proyectos que desarrollo, por lo que la única razón por la que tengo que lidiar con la instalación y cualquier gema es únicamente para manejar Sass. Eso es un conjunto de errores de conexión y problemas de instalación que no necesito si puedo evitarlo..
Sospecho que muchas otras personas también están en el mismo barco de no usar Ruby, y no lo desean especialmente para usar un preprocesador CSS.
Además, aunque necesito instalar Ruby para usar Sass, todavía necesito trabajar con Node.js y NPM para usar Grunt para manejar otros aspectos de mis proyectos, como observar cambios, combinarlos y minimizarlos. JavaScript y así sucesivamente, así como Bower para la gestión de otros paquetes.
Nota: hay un programa llamado Scout para Mac y Windows que se encargará de la compilación, pero nuevamente, siempre que sea posible, prefiero evitar la instalación de algo solo para un solo propósito, en lugar de trabajar con herramientas que puedo usar para múltiples propósitos. También está CodeKit, pero eso es solo Mac.
Entonces, cuando hay un preprocesador como Stylus que tiene todo el poder lógico que necesito, pero que puedo usar fácilmente con mi IDE preferido y la configuración existente de Node.js o JavaScript puro, tiene sentido elegirlo.
Muchas personas encuentran el proceso de configuración de Sass intimidante debido al factor Ruby y eligen MENOS por ese motivo. Sin embargo, me parece que la facilidad de configuración de Stylus está esencialmente a la par con LESS, mientras que me brinda toda la gama de funciones lógicas..
Pero no se trata solo de Ruby, o incluso de la funcionalidad lógica disponible. También se trata de la forma específica en que Stylus funciona y la sintaxis que utiliza, que me parece increíblemente limpia, flexible y fluida en comparación con LESS y Sass..
Ahora, déjame decirte por qué elegí Stylus y por qué podría ser tu nuevo héroe de CSS.
Como mencioné anteriormente, elegí Stylus por su:
Para mostrarle realmente por qué todo lo anterior me hace elegir el Stylus, tenemos que saltar y comenzar a usarlo un poco para que pueda mostrarle exactamente de lo que estoy hablando..
Comencemos con el mayor obstáculo con el que se encuentran los preprocesadores de CSS, el que elijan, y eso es la configuración y la compilación..
Una gran parte de la razón por la que elijo Stylus es que puedo configurarlo como parte de mis métodos regulares de creación de proyectos y, a través de eso, puedo usarlo con mi IDE preferido. Déjame enseñarte como.
Sí, hay algunos procesos de línea de comando involucrados, sin embargo, tómelo de alguien que nunca haya usado una línea de comando para algo antes de que los preprocesadores lo requieran. Diez por ciento más inteligente que antes. :)
Dicho esto, he reunido un paquete, que puede agarrar presionando el botón "Descargar" en la parte superior de este artículo, lo que significará que apenas tendrá que pensar en la línea de comandos si está en Windows. Solo unos pocos clics y estará listo y funcionando.
Si estás en Mac o Linux, no temas, ya que solo hay tres comandos que tendrás que ejecutar para usar el paquete, te mostraré cómo y son muy fáciles..
Este paquete observará los archivos de Stylus de origen en busca de cambios y los compilará en archivos CSS para usted. Puede usarlo con cualquier IDE que desee, lo cual es un gran beneficio de este enfoque particular.
Para mí, personalmente, es el épico y asombroso Sublime Text 2. También es el IDE que recomiendo usar con Stylus debido al excelente paquete de resaltado de sintaxis Stylus disponible para él, que veré a continuación..
Node.js es prácticamente imprescindible en estos días para el desarrollo web front-end. Hay tantas herramientas asombrosas que funcionan en la parte superior, por lo que la instalación te ayudará a establecer no solo para Stylus, sino también para muchas otras cosas..
Vaya a http://nodejs.org/download/ y descargue el instalador para su sistema operativo.
Ejecute el instalador como lo haría con cualquier otro para colocar Node.js en su sistema.
Grunt es una herramienta increíble para ejecutar tareas de JavaScript. Puede usarlo para más de dos mil propósitos diferentes a través de sus complementos, que se enumeran aquí: http://gruntjs.com/plugins
En nuestro caso, lo usaremos para ver nuestros archivos Stylus y compilarlos en CSS cada vez que cambien..
Prepárese para su primera prueba de la línea de comando, así que abra una ventana de comando / terminal.
En Windows, encuentro que la forma más sencilla es abrir el Explorador de Windows, luego, dentro de cualquier carpeta, mantenga presionada la tecla MAYÚS y haga clic con el botón derecho. En el menú contextual, verá "Abrir ventana de comandos aquí", en la que debe hacer clic:
Alternativamente, puede hacer clic en el botón "Inicio", luego buscar "cmd" y presionar ENTER para abrir la ventana de comando.
Si está en Linux, supongo que probablemente ya sepa cómo abrir un terminal, pero si no está aquí, encontrará una guía sobre cómo usar las distintas distribuciones: https://help.ubuntu.com/community/UsingTheTerminal
Y si estás en Mac, mira la Introducción de A Designer a la línea de comandos.
Ahora, escriba el siguiente comando y presione ENTER:
npm instalar -g grunt-cli
Verás una carga de texto como este en la ventana:
Espere hasta que todo termine y aparezca un nuevo símbolo del sistema. Eso significará que la instalación está completa, y luego puede cerrar la ventana de comandos / terminal. Solo necesita hacer esto una vez, ya que instalará Grunt en su sistema con acceso global para que pueda usarlo desde cualquier carpeta de proyecto futuro que configure.
Ahora está listo para configurar un proyecto real utilizando el paquete StylusCompiler que le proporcioné. Este es el proceso que repetirás para cada nuevo proyecto de diseño que comiences..
Vayamos paso a paso..
Crea una carpeta para albergar tu proyecto. Para esta demo, lo llamaremos EGProyecto.
Dentro de eso, crea una segunda carpeta llamada css. Esta es la carpeta en la que se escribirán tus archivos CSS.
Ahora extrae el StylusCompiler.zip archivo en esta carpeta.
Deberías terminar con una estructura que se vea así:
Entrar en el StylusCompiler y, si está en Windows, haga doble clic en el archivo llamado double_click_to_install.bat.
Si no estás en Windows, abre un terminal en el StylusCompiler carpeta (o abra un terminal y luego navegue / cd a la carpeta). Escriba lo siguiente y luego presione ENTER:
npm instalarEsto instalará el compilador dentro de la carpeta de su proyecto. Una vez más, verás un montón de cosas como esta en la ventana:
Si está en Windows y hace doble clic en el archivo .bat, la ventana se cerrará una vez que se haya completado la instalación. De lo contrario, espere hasta que el texto deje de moverse y aparezca un nuevo símbolo del sistema. Mantenga su terminal abierta para el siguiente paso.. Ahora todo lo que necesita hacer es iniciar la función de "observación" que el proyecto le tiene configurado para usar a través de Grunt. Esto va a ver el aguja carpeta dentro de la StylusCompiler Carpeta para cambios a cualquier .estilo archivos dentro de ella.
Simplemente crea todos los archivos Stylus que necesites en ese aguja carpeta y ya está bueno para ir. Nota: Todos sus archivos Stylus deben tener el .estilo extensión de archivo. Cuando los cambios se guardan en cualquier archivo en esa carpeta, el paquete compilará su código Stylus en CSS y lo escribirá en un archivo llamado style.css en el css Carpeta de tu proyecto. Todavía en el StylusCompiler carpeta, si está en Windows, haga doble clic en el archivo llamado watch_and_compile.bat.
Si no está en Windows, con su terminal todavía en la StylusCompiler carpeta, escriba lo siguiente y presione ENTER:
reloj gruñido
Deberías ver esto en la ventana de comandos / terminal:
Ahora si guarda los cambios en cualquier archivo en el StylusCompiler> stylus carpeta (siempre y cuando no haya cometido ningún error en su código), verá lo siguiente:
Cuando haya terminado de trabajar en sus archivos Stylus, simplemente puede cerrar la ventana de comandos / terminal, o si necesita ejecutar otro comando, puede presionar CTRL + C para detener la tarea de "observación".
Una de las razones por las que me encanta trabajar con este tipo de configuración de proyecto es que usted tiene el control completo, por lo que puede configurar su proyecto como desee y cambiarlo en cualquier momento. Si desea cambiar cosas como la carpeta de salida de su css, el nombre del archivo de salida, si el CSS está comprimido o no, etc., puede hacerlo en el archivo denominado Gruntfile.js en el StylusCompiler carpeta.
Estamos usando el complemento grunt-contrib-stylus para que Grunt maneje la compilación, para que pueda obtener un resumen completo de todas las configuraciones posibles para él aquí: https://github.com/gruntjs/grunt-contrib-stylus.
Sin embargo, aquí están las principales opciones que probablemente querrás.
Selecciona el comprimir opción a cierto para producción listo para CSS minificado, o para falso para CSS expandido mientras todavía estás en desarrollo.
El nombre de archivo predeterminado que se escribirá es "style.css". Si desea que el archivo tenga otro nombre, reemplace "style.css" con su elección en esta línea.
Por defecto, el compilador buscará un nivel desde el StylusCompiler carpeta, y escribir en el css carpeta en ella.
Si desea que sus archivos CSS se escriban en otro lugar, cambie el valor en esta línea de '… / Css' a su ubicación preferida.
Como mencioné anteriormente, la belleza de este enfoque es que puedes usar cualquier IDE para editar tus archivos Stylus y se compilarán de la misma manera. Sin embargo, recomiendo encarecidamente utilizar Sublime Text 2, ya que el paquete de resaltado de sintaxis Stylus disponible hace que trabajar con Stylus sea una delicia..
Puede descargar Sublime Text 2 aquí: http://www.sublimetext.com/2.
Después de descargar e instalar, visite esta página y siga las instrucciones para instalar "Package Control", el brillante administrador de paquetes para Sublime Text: https://sublime.wbond.net/installation#st2
Finalmente, instale el paquete de resaltado de sintaxis Stylus. Abra el Control de paquetes yendo a Preferencias> Control de paquetes de la siguiente manera:
En la lista que aparece, haga clic en la opción "Instalar paquete" y espere unos segundos mientras se recupera una lista de paquetes disponibles:
Escriba "stylus" en el campo sobre la lista de paquetes para buscarlo, luego haga clic en el resultado titulado "Stylus" para instalarlo:
Este paquete ahora será difícil de leer, el formato de CSS normal es el siguiente:
... en un código Stylus fácilmente diferenciado como este:
Una de las cosas que me encanta de Stylus es su total flexibilidad en la sintaxis..
Con MENOS, todo el código debe escribirse de la misma manera que escribiría CSS normal, es decir, debe incluir llaves, dos puntos y punto y coma de la misma manera que en CSS.
Con Sass / SCSS tienes una opción:
Por otro lado, el lápiz óptico es totalmente flexible, y no tiene que configurar ninguna opción de compilación para manejar la forma en que desea escribir.
Todos estos ejemplos se compilarán en Stylus, y los enfoques de sintaxis se pueden usar juntos en el mismo documento:
Solo Stylus permite la omisión de todos estos elementos de sintaxis, en diversos grados, y la combinación "sobre la marcha" de estos enfoques para que pueda hacer lo que quiera mientras su proyecto avanza..
Esta funcionalidad es increíble para el desarrollo. Se sorprenderá al descubrir cuánto mayor es su flujo cuando omite toda la sintaxis "puntuación" que puede. Tu codificación y tu proceso de pensamiento a medida que avanzas serán mucho más suaves. Y con el resaltado de sintaxis proporcionado por el paquete que instalamos anteriormente, encontrará que su código será tan legible.
Pero al mismo tiempo la compilación es muy indulgente. Si decide por una razón u otra que la sintaxis CSS normal hará que parte de su documento esté mejor organizado, puede seguir adelante y usarlo cuando lo desee. Y si accidentalmente se pierde un punto y coma aquí o allá, a nadie le importa.
Vio anteriormente algunos ejemplos de cómo se ven las variables, las combinaciones, las verificaciones condicionales y las funciones en MENOS y en Sass. En mi opinión, me parece que el enfoque de Stylus para estos es más fácil de ver, leer y trabajar en general..
En MENOS, las variables deben ser precedidas con la @ símbolo. En Sass, deben ser precedidas con la PS símbolo. Sin embargo, en Stylus, una variable no tiene que ser precedida con nada en absoluto.
Nota: Opcionalmente puede utilizar el PS símbolo si lo prefiere, pero no el @ Este símbolo está reservado para otros fines en Stylus..
De manera similar, las combinaciones, las comprobaciones condicionales y las funciones no deben incluirse con nada en Stylus.
En MENOS, una mezcla debe escribirse de la misma manera que escribiría una clase CSS normal, y no hay verificaciones condicionales o funciones personalizadas.
En Sass, los mixins deben ir precedidos de @mixin y llamado con @incluir, Los controles condicionales se escriben como @Si y @más, y funciones deben ser precedidas con @función e incluir una línea prependida con @regreso.
Ninguna de estas cosas se requiere en Stylus. Simplemente puede escribir de forma natural como lo haría en el lenguaje regular. Por ejemplo, anteriormente usamos este ejemplo Sass mixin and function:
@mixin border_and_bg ($ border_on, $ border_color, $ bg_on, $ bg_color) @if $ border_on == true border: 1px solid $ border_color; @else border: 0; @if $ bg_on == true background-color: 1px solid $ bg_color; @else color de fondo: transparente;
@function nombre-función ($ parámetro) @return $ dosomething + $ parámetro / $ somethingelse;
Esta mezcla y función se llamaría así:
.callem @include border_and_bg (true, # 000, true, #fff); tamaño de letra: nombre-función (6);
En Stylus, estos se pueden escribir y llamar de la siguiente manera:
Para mí, esto es muy claro, fácil de leer y escribir, y en consonancia con el objetivo del preprocesador de hacer el código limpio y mínimo.
Tenga en cuenta también que mientras en el ejemplo anterior omití toda la "puntuacion" de la sintaxis que se puede omitir, es totalmente opcional la cantidad que desea omitir en su desarrollo..
Por ejemplo, he llamado al border_and_bg Mezcla perfectamente, escribiéndolo esencialmente de la misma manera que lo haría con una propiedad CSS normal, sin paréntesis alrededor de los parámetros o comas entre ellos. Sin embargo, si lo prefiere, puede incluir corchetes y comas cuando llama a los mixins, depende completamente de usted..
Una de las mejores cosas de trabajar con Sass y LESS son las bibliotecas de mezcla Compass / Bourbon y LESShat, respectivamente. Pero no te perderás una increíble biblioteca de mixins con Stylus, gracias a Nib.
El paquete "StylusCompiler" que le proporcioné se instala automáticamente (gracias a grunt-contrib-stylus) e incluye Nib en su proyecto, por lo que no tiene que tomar más pasos para usarlo.
Nib proporciona mixins para todos los efectos CSS3 que usted esperaría, cada uno de los cuales puede llamarse a la perfección como si estuviera usando una propiedad CSS normal. También incluye una impresionante variedad de combinaciones para otras funciones como posicionamiento, restablecimiento / normalización, corrección de imágenes, imágenes sensibles y más.
Echa un vistazo a los documentos para un resumen completo aquí: http://visionmedia.github.io/nib/
Nota: Una segunda opción de biblioteca de mezcla para Stylus es Axis.
Stylus tiene un montón de otras características asombrosas, hechas de una manera única y súper limpia, y realmente deberías revisar el lote completo aquí: http://learnboost.github.io/stylus/
Sin embargo, hay una pareja en particular que realmente amo.
Los parámetros de descanso le permiten pasar un número indeterminado de valores a una mezcla sin tener que asignarlos explícitamente en la creación de la mezcla. Puede extraer un valor particular y luego pasar el "resto" usando args ... y args. Por ejemplo:
A veces puede que esté repitiendo un cierto valor un par de veces, pero solo dentro de un solo estilo, por lo que tener que declarar una variable para mantenerla puede ser excesivo.
Con la función de búsqueda de propiedades, puede buscar el valor de cualquier propiedad que haya declarado en el mismo estilo o en un estilo principal. Por ejemplo:
Todo lo que tienes que hacer es usar el @ Símbolo antes de la propiedad que desea buscar. El lápiz se verá primero en el mismo estilo y, si no encuentra ninguna coincidencia, verificará al padre y continuará aumentando hasta que encuentre una coincidencia o llegue a la raíz del documento y devuelva "nulo".
Esperemos que ahora te sientas listo para abordar la configuración del Stylus si has sido cauteloso con la línea de comando antes, y tienes la curiosidad de investigar si te encanta el poder de Sass pero preferirías trabajar con Node.js sobre Ruby. E incluso si ninguno de los dos es particularmente relevante para usted, espero que esté lo suficientemente intrigado por algunos de los enfoques únicos que utiliza Stylus para mejorarlo y jugar con él..
Para terminar, me gustaría dejarte con una lista de interesantes productos relacionados con Stylus para que los eches un vistazo, algunos mencionados anteriormente, así como algunos extras..
Disfrutar!
Accentsconagua