Cómo instalar y comenzar con Sass?

Hojas de estilo sintácticamente impresionantes (SASS), una extensión de CSS que preprocesas CSS y funciona bien con todas sus versiones y mejora la capacidad del lenguaje básico. Ahorra mucho tiempo y esfuerzo al evitar que sus usuarios usen valores redundantes de CSS. Además, puede descargar y usar Sass gratis. En este artículo, le diremos cómo instalar y comenzar con Sass.

Cómo instalar y comenzar con Sass

El procedimiento de instalación de SASS se puede llevar a cabo de varias maneras, como usar algunas aplicaciones de código abierto, instalar SASS usando la línea de comando, instalarla en los editores de código deseados como VS Code, Sublime, Atom, etc. o instalar en cualquier lugar en cualquier lugar Del repositorio de Github.

Discutamos estos procedimientos de instalación en detalle.

Instale Sass usando aplicaciones

Hay numerosas aplicaciones disponibles (pagadas y gratuitas) que lo ayudarán a instalar y ejecutar Sass en poco tiempo para Windows, Mac OS y Linux. Algunas aplicaciones se enumeran a continuación.

1. Preposte (pagado) para Windows, Mac y Linux.
2. Codekit (pagado) para Mac.
3. Martillo (pagado) por mac.
4. Koala (gratis) para Mac, Linux y Windows.
5. Scout-app (gratis) para Linux, Mac y Windows.

Nota: No es necesario usar las aplicaciones pagas para las fases de desarrollo iniciales porque las libres son completamente funcionales.

Instale SASS usando la línea de comandos

A continuación hemos discutido cómo puede instalar SASS utilizando la línea de comandos en varias plataformas.

Instalación en cualquier lugar (independiente)

Puede con gran facilidad instalar sass en cualquier plataforma como Mac OS, Linux, Windows descargando su paquete que sea relevante para la plataforma que usa, desde el repositorio de GitHub. Una vez descargado, incluye el paquete en su camino. Dicha instalación no requiere ninguna dependencia, por lo tanto, es el enfoque más fácil.

Instalación a través de NPM

Si eres un nodo.Usuario de JS, entonces puede usar el siguiente comando npm e instalar el paquete de sass.

NPM instalación -g sass

El comando anterior instala una implementación JS pura de SASS que es un poco más lenta que otras opciones de instalación disponibles. Sin embargo, si desea mejorar su velocidad, puede cambiar su implementación a cualquier otra ya que la implementación de JS tiene la misma interfaz como otras implementaciones.

Instalación a través de Chocolatey

Si tiene un sistema operativo Windows y también tiene un Administrador de paquetes de Chocolatey instalado, entonces utiliza el siguiente comando para instalar Dart Sass.

choco install sass

Instalación a través de Homebrew

Los usuarios de Mac OS X y Linux pueden instalar el paquete SASS usando el Administrador de paquetes HomeBrew a través del siguiente comando.

Brew instalar sass/sass/sass

Instalar Sass en los editores de código

Como ya se mencionó, puede usar SASS en varios editores de código como VS Code, Sublime, Atom, etc. Esta podría ser una opción preferida para muchos, ya que la mayoría de nosotros ya estamos familiarizados con muchos editores de código populares. Por ejemplo, en aras de la comprensión, aquí demostraremos cómo puede usar Sass en VS Code.

Paso 1

Visite el compilador Live Sass y presione Instalar para descargar la extensión.

Paso 2

Tan pronto como presione el botón Instalar, la extensión se abrirá en su editor de código VS.

Ahora presione el botón de instalación resaltado y la extensión se instalará en el editor de códigos.

Extensión instalada correctamente!

Nota: Cuando se instala la extensión, puede usar Ctrl + Shift + X Para abrir la extensión en cualquier momento que desee.

Paso 3

Ahora puedes abrir el .archivo SCSS y comienza a escribir tu hoja de estilo. Una vez que haga esto, notará una opción que dice "Mira Sass" en el editor.

Haga clic en esta opción para generar el archivo de mapa CSS y el archivo CSS automáticamente. Más adelante, puede vincular este archivo CSS a su documento HTML.

Siga los pasos mencionados anteriormente para instalar fácilmente SASS en su editor de código VS.

Conclusión

Puede instalar y comenzar con SASS utilizando varias formas, como usar algunas aplicaciones de código abierto, instalarla utilizando la línea de comandos, instalarla en los editores de código deseados, como VS Code, Sublime, Atom, etc., o instalarla en cualquier lugar desde el repositorio de Github. Puede seleccionar cualquiera de las opciones dependiendo de su facilidad y deseo. Todas estas opciones se han explicado en profundidad en esta publicación.