Specify output file names when watching a whole directory with node-sass

It seems that the feature you need does not exist as a built-in for the node-sass cli.

Assuming you work with bash, this may do the trick for you.

find src/scss -name '*.scss' -exec sh -c 'node-sass $0 dist/css/$(basename $0 .scss).min.css --output-style compressed' {} \;

How does it work

What this script does is getting the relative path of each file in the folder tree, whose file name matches the pattern '*.scss' and it executes for each path the node-sass command specifically on the file, defining the output by removing the '.scss' initial extension and replacing it with the '.min.css' extension as you wish.

For exemple let's say you have in the src/scss/ folder

  • myfile1.scss
  • subfolder/
    • myfile2.scss

This would execute :

node-sass src/scss/myfile1.scss dist/css/myfile1.min.css --output-style compressed 
node-sass src/scss/subfolder/myfile2.scss dist/css/myfile2.min.css --output-style compressed 

Optional

You can put this script in a file ./bin/scss-watcher.sh, make it executable and directly call it to wrap the logic.

"sass-build" : "./bin/scss-watcher.sh"