w3schools tutorial scss examples compile anidacion css ruby sass watch

css - tutorial - sass--watch



Sass--no se recompila (3)

Sass actualiza mi build.css hoja de estilos principal cuando build.css cambios en build.scss , pero no actualizará build.css cuando guarde los cambios en los parciales, por ejemplo _grid-settings.scss . En esencia, tengo que volver a guardar manualmente build.scss cada vez que realizo un cambio en un parcial para que Sass detecte un cambio.

Desde mi terminal:

Justins-MacBook-Air:ageneralist justinbrown$ sass --watch stylesheets:stylesheets >>> Sass is watching for changes. Press Ctrl-C to stop. write stylesheets/build.css [Listen warning]: Listen will be polling for changes. Learn more at https://github.com/guard/listen#polling-fallback.

Mi directorio es:

stylesheets/ ├── base │   └── _base.scss ├── build.css ├── build.scss ├── layout │   └── _layout.scss └── vendor ├── _grid-settings.scss ├── bourbon ├── highlight └── neat

Estoy usando:

  • Sass 3.3.8.
  • Ruby 2.0.0-p353
  • OSX 10.9

sass --watch varias publicaciones de SO sobre problemas con sass --watch pero ninguna me ayudó a encontrar una solución.

EDITAR: Estoy agregando mi build.scss aquí en caso de que ese sea el problema:

@import "vendor/bourbon/bourbon"; @import "vendor/grid-settings"; @import "vendor/neat/neat"; @import "base/base"; @import "layout/layout";


Esta no es una respuesta satisfactoria para mí, pero terminé probando otra joya que manejaría el preprocesamiento, guard-livereload , y aunque en sí misma no funcionó, cuando volví para probar sass --watch sass monitoreó adecuadamente mi directorio de hojas de estilo para cambios (parciales incluidos) y recompilado posteriormente build.scss .

No estoy seguro de por qué funciona ahora, pero estoy adivinando que una de las gemas instaladas junto con guard o guard-livereload resolvió el problema. Tal vez listen o fssm ?


También me había aferrado al problema de que Sass no estaba viendo todos los cambios de archivos correctamente.

Sass no puede ver los cambios en los archivos que se encuentran en la ruta que dirige hacia arriba el archivo de observación. Por ejemplo:

Variante A (que tuve)

scss/ ├── base │ └── controller1.scss ├── utils │ └── utils.scss └── app └── app.scss

Donde app.scss es:

@import ''../base/container1'' @import ''../utils/utils''

compilando

sass --watch app / app.scss: ../ css / styles.css

sass --watch app: ../ css

En ambos casos, sass solo rastrea cambios en el archivo app.scss , pero no en controller1.scss o utils.scss

Variante B (solución)

scss/ ├── base │ └── controller1.scss ├── utils │ └── utils.scss └── app.scss

Donde app.scss:

@import ''base/container1'' @import ''utils/utils''

compilando

sass --watch app.scss: ../ css / styles.css

La variante C (solución) también funciona

scss/ ├── base │ └── controller1.scss ├── utils │ └── utils.scss └── app.scss

Donde app.scss:

@import ''base/container1''

y controller1.scss:

@import ''../utils/utils'' // ...


Tuve el mismo problema.

Logré solucionarlo borrando el directorio de caché SASS. También ejecuté sudo gem update para actualizar todas las gemas en mi sistema.

No estoy seguro de cuál de estas cosas lo solucionó o si fue una combinación de los dos.