Search code examples
sasswebstormfile-watcher

How Can I Make WebStorm SCSS File Watcher Output to Different Directory

I'm trying to use WebStorm's SCSS file watcher, but no matter what settings I change it always outputs the generated .css file to the same directory as the .scss file.

I've tried changing the "arguments" from:

--no-cache --update $FileName$:$FileNameWithoutExtension$.css

to:

--no-cache --update ../$FileName$:$FileNameWithoutExtension$.css

but the output file is still generated in the same place. However, I did modify and save my .scss file, saw the file watcher trigger, and saw that the generated file changed ... it just didn't put the changed version in a different location.

I tried providing --output and -o options, but was told those are invalid (which makes sense because the command-line SCSS expects the output to be an argument not an option). So then I tried using just:

../$FileName$:$FileNameWithoutExtension$.css

no luck. Then I thought "maybe it's the 'Output paths to refresh'", so I changed that from:

$FileNameWithoutExtension$.css:$FileNameWithoutExtension$.css.map

to:

../$FileNameWithoutExtension$.css:$FileNameWithoutExtension$.css.map

... and still, I just get the output file in the same directory.

Is it even possible to make WebStorm output to somewhere else, or is the output path fixed?

Solution

  • Ex: If you want the css in root/css/

    Just give "--no-cache --update $FileName$:$FileParentDir$/css/$FileNameWithoutExtension$.css" to "Arguments"