¿Cómo ver los cambios en todo el directorio/carpeta que contiene muchos archivos sass?

SASS es un poderoso lenguaje de preprocesamiento que nos ayuda a escribir nuestro código de manera más eficiente de una manera fácil y concisa. Algunas de las mejores características de sass son el uso de variables, el anidamiento de soporte y el uso de funciones. Si bien tiene muchas ventajas, hacer un seguimiento de todos los cambios en un archivo sass puede parecer una tarea complicada.
El método más fácil para compilar cambios en un archivo sass se puede realizar con la ayuda de Node Package Manager (NPM).
Para ello, deberá instalar la última versión de Node.js o tener una versión LTS estable del Node. Para comprobar si ha instalado correctamente Node.js en su sistema, ejecute los siguientes comandos en su terminal/símbolo del sistema:

node -v 

npm -v 

Después de instalar la última versión de Node.js, siga estos pasos para compilar sus archivos sass. Estos son:

  • Inicialice NPM en su directorio raíz usando la terminal.
    npm init

    El npm initcomando le hará algunas preguntas para generar un archivo package.json en su proyecto. Este archivo contiene la información sobre las dependencias instaladas.
    Para evitar estas preguntas, puede escribir el siguiente comando:

    npm init -y

    Esto configurará automáticamente las opciones a los valores predeterminados.

  • Instalar Node-sass.
    npm install node-sass --save-dev
    

    Node-sass es una biblioteca que compila de forma nativa archivos scss a css. Este comando instalará node-sass como una dependencia de desarrollo.

  • En el archivo package.json, debe realizar cambios en el campo de secuencias de comandos.

    "scripts" :{
      "compile:sass": "node-sass sass/main.scss css/style.css -w"
    }

    Este comando nos dice que busquemos nuestro archivo sass principal y lo compilemos en CSS. -wsignifica watch flag que se usa para realizar un seguimiento de todos los cambios en el archivo fuente y se vuelve a compilar cada vez que se guarda el archivo sass.

  • Ejecute el comando en su terminal: Abra la terminal y ejecute el comando:
    npm run compile:sass
    

Publicación traducida automáticamente

Artículo escrito por ashitace696 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *