Compass has a lovely command that will watch and compile all scss in a given directory:
compass watch *foldername*
However, the Ruby-based compass is kind of slow and the C-based SASSC, wrapped in the form of node-sass, is much faster. Thing is, I haven't been able to replicate this seemingly simple feature using node-sass.
I followed the directions given here: http://benfrain.com/lightning-fast-sass-compiling-with-libsass-node-sass-and-grunt-sass/, which do a great job of setting up node-sass with grunt to watch for file changes, but it doesn't seem to support watching and converting an entire folder, agnostic of the file names within.
I've tried changing the
sass: {
dist: {
files: {
'css/styles.css': 'sass/styles.scss'
}
}
}
values to the folders, amongst many other things, and nothing seems to work. I'll admit that I don't really know anything about grunt. Is there a way to replicate
compass watch *folder*
or
sass --watch *folder*:*folder*
that I haven't tried, or does this not exist?
Yaniv was on the right track, but the magic seemed to be in "expand". Here's what ended up working:
sass: {
dist: {
files: [{
expand: true,
src: ['sitecontent/**/*.{scss,sass}'],
ext: '.css'
}]
}
}
This compiles all sass files in the sitecontent folder and all subfolders and puts the css next to the sass file - it doesn't compile them to some other folder.