css - instalar - cómo ver los cambios en todo el directorio/carpeta que contiene muchos archivos sass

sass import css

Question

¿Cómo podría rastrear cambios en todo el directorio que contiene muchos archivos sass? Estoy usando el siguiente comando para ver los cambios en sass

expediente:

sass --watch style.scss:style.css

Pero cómo ver los cambios en todo el directorio / carpeta que contiene muchos archivos sass.

Answer 1

Ampliando la respuesta un poco piouPiouM:

• Los archivos de salida se crearán con los mismos nombres que los archivos de entrada, excepto que terminen con .css .
• <input folder> y <output folder> pueden ser iguales.

• Ambas carpetas pueden ser el directorio de trabajo actual, por lo que lo siguiente es válido:

  $ sass --watch .:.

Answer 2

Ir a tu terminal y llegar a tu carpeta luego escribiste:

 sass --watch .

esto observará todos los archivos sass y los convertirá a archivos css con el mismo nombre. También puedes hacerlo de esta manera:

sass --watch ~/user/youUser/workspace/project/styles/

Espero que esto pueda ayudarte.

Answer 3

Por si alguien se enfrenta con este problema en 2018:
El sitio web de sass se refiere a Ruby Sass que está en deprecated . y como ahora (mayo de 2018) si instala dart sass a través de npm , no admite el comando --watch

Qué hacer:
necesitas instalar node-sass globaly, como:

npm install node-sass -g

y luego reinicie la línea de comando, luego use este código:

node-sass --watch scss/styles.scss css/styles.css

para compilar tus archivos scass a css.
básicamente node-sass admite el comando --watch y lo usamos para compilar nuestros códigos scss en archivos css normales.

y en caso de que reciba un error como este la primera vez que guarde su archivo .scss:

{
  "status": 3,
  "message": "File to read not found or unreadable: yourdirectory/scss/styles.scss",
  "formatted": "Internal Error: File to read not found or unreadable: yourdirectory/scss/styles.scss/n"
}

Lo que debes hacer es guardarlo de nuevo, ¡funcionará correctamente!

Answer 4

Puede crear un archivo Sass que incluya el resto de los archivos y luego ver este archivo.

Alternativamente, busca en Grunt y el muy buen complemento grunt-contrib-compass

Answer 5

Según la información, puede utilizar la siguiente línea de comando:

sass --watch .

Fuente: http://sassbreak.com/watch-your-sass/#what-does---watch-do

Answer 6

Si está en su carpeta actual, haga lo siguiente para verlo.

F:/sass tutorial>sass --watch ./:./

Answer 7

Simplemente use el comando sass --watch <input folder>:<output folder> , así:

$ ls -l
css/ sass/
$ sass --watch sass:css

Donde <input folder> contiene los archivos Sass y <output folder> que alberga los archivos CSS generados.

Answer 8

Terminé haciendo esto sin usar Grunt o Sass-watch:

npm install -g watch
watch "sass assets/app.scss assets/dist/app.css" assets/css